OverResponse DOCS

Want to know how to implement OverResponse in your site? This is the place to get started.

This documentation is still under development.

Survey Configuration

By default, OverResponse requires a global variable called ORSettings with following attributes:

Attribute Possible Values Notes
surveyId (required) Unique survey ID
containerId (required) The ID of the div element where the survey will be inserted Code provided in Publish page on the survey editor will create this container where the code is placed.
minimalSize true or false When true, the survey will set its size to the minimum size, determined by the item with the item with the biggest height.
height A string with desired height for the survey This number is important when used in conjuction with expandable option, since the size of the container is established after the user clicks the first question. In other cases, you may set a height directly to the provided container, using your favorite method.
expandable true or false When true, after the user answers the first item, the survey will set to the height specified in height parameter.
alwaysShow true or false By default, if users starts filling a survey, they will not be able to see the same survey again (unless cookies are cleared). Use this flag to force the display of a survey.
showDelay int (milliseconds) If desired, a fixed delay for the survey can be specified. This delay starts after the respondant.js file has been loaded.
autoHide true or false When using the default behavior, this setting will make the survey container to disappear after the user finishes the survey.
fullScreen true or false When true, the survey will have some features that assume the survey is the only (or at least, the main) item on page. For instance, the listener to the scroll will be enabled in all the body, versus the default behavior that only handles scroll in the survey container.
ignoreFirstMouseScroll true or false When true, survey will not capture mouse scroll unless the survey is activated by the user. When the flag is not set, default value will depend on fullScreen setting: if fullScreen is true, the this flag will default to false, and viceversa.
template Object name from array of templates The template to use, from the templates array. If using OverResponse default templates, possible values are: Slim, ButtonLess and Simple.
templates Object Object composed of user templates. Each template only has one element. For instance, an object with a single template would be defined as: 

{
  Slim: {
    html: ''
    + '<div class="ORSlimContainer">'
    + '	 <div class="ORLayoutCenter">'
    + '	   <div class="ORSurveyContent"></div>'
    + '	 </div>'
    + '	 <div class="ORLayoutButtons">'
    + '	   <div class="ORLayoutButtonRow">'
    + '      <div class="ORLayoutLeft ORLeft Rounded5px NonSelectable">&lsaquo;</div>'
    + '      <div class="ORLayoutRight ORRight Rounded5px NonSelectable">&raquo;</div>'
    + '	   </div>'
    + '	 </div>'
    + '</div>'
  }
}
controlClass String with CSS class name If provided, this class will be added to all form controls that are system controls (only textboxes and textareas at the moment). Please note that checkboxes and radio elements are rendered using images.
events Object Each element must be named as the corresponding handler. For instance, the following code displays an alert box when the user answers the first question of a survey: 

var ORSettings = {
  ... some other settings ...
  events: {
    onFirstItemChange: afterUserClickFirstItem
  }
};

function afterUserClickFirstItem(event) {
  alert('Hello world');
}
Please read more on events bellow.

Events

OverResponse provides facility to handle almost all events related to the survey displaying and user interaction with the user. For instance, you can handle events to:

  • Adjust your website content based on a response (e.g. Redirect respondant that says 'yes' to participate in a experiment)
  • Use your own data store for responses
  • Integrate with your favorite JS Framework
  • Handle special events (such as bounces)

Event handlers are also assigned using the ORSettings object.

Event Fired when Notes
onFirstItemChange User submits it first response The event is fired even if the item is not the first item in the survey (for instance, when user skips questions).
onItemChange User submits or changes a response The event is fires always the user submits a new response, or if a new value is sumitted.
onSurveyFinish User reaches the end of the survey It will fire everytime the user is presented with the closing message of the survey. If the user returns to a previous item, and then again returns to the closing message, the callback will fire again.

All event handlers receive an object with the event data. This object contains the following objects:

Element Type Notes
survey.reject Function Call this method to hide the survey, and register it as a bounce.
survey.container jQuery element The main container for the survey.
response.value String The new string value for the related item.
OverResponse   |   Give it a try here