Skip to main content

FV Kinesis Support

All the topics, resources needed for FV Kinesis.

FocusVision Knowledge Base

Change Page Behavior

The code library contains examples and resources from the Kinesis Technical Support department. You'll find HTML, Javascript and PHP examples for use in Custom HTML Ranges and Advanced Properties across all question types. Examples are organized by question type.

Don't see something you're looking for? Contact Technical Support with your suggestion and we'll add it.

1:  Auto-Submit A Page

The following javascript is to be placed anywhere within the HTML of the page and will automatically submit the survey page as soon as it loads. We recommend that if you need a hidden question to store, to place it with a displayed pagebreak and set display to never instead.
VIEW DEMO

<script type="text/javascript"><!--
$(document).ready(function() {

     document.forms[0].submit();
});
// --></script>

2:  Submit Page on Timer

The following javascript is to be placed anywhere within the HTML of the page and will automatically submit the survey page after a set amount of time (in milliseconds): VIEW DEMO

<script type="text/javascript"><!--
$(document).ready(function() {

     setTimeout("document.forms[0].submit();",5000);

});
// --></script>

3:  Display Submit Buttons on Timer

This script can be placed anywhere within the HTML of the page to hide the selected input(s) until a set amount of time (in milliseconds). Use the input ID within the script to specify a particular button.

VIEW DEMO

<script type="text/javascript"><!--
$(document).ready(function() {
     $('#buttonnext').hide();
     setTimeout("$('#buttonnext').show();",10000);
});
// --></script>

Within a custom HTML range, add a DIV with a unique ID (avoid using generic words or phrases - there should only be one ID for an element on the page) enclosing the buttons and change the IDs in the Javascript to match that ID. Here is an example showing some Javascript and HTML referencing the ID of a single div tag:

Javascript:

<script type="text/javascript"><!--
$(document).ready(function() {
     $('#custombuttons').hide();
     setTimeout("$('#custombuttons').show();",10000);
});
// --></script>

HTML:

<div id="custombuttons">
%BACK% %CONTINUE%
</div>

4:  Change Submit Buttons Text

The default submit button text can be changed within Survey Properties. To change it for a single page, place the following javascript within the HTML of the page. The example below will change the continue button text to "Finish". Change the input ID (#buttonnext, #buttonback) to specify the button you would like to change.

VIEW DEMO

<script type="text/javascript"><!--
$(document).ready(function() {

     $('#buttonnext').val('Finish');
});
// --></script>

5:  Suppress Back Button Warning Message

This script will suppress the message that appears when backing up in a survey. You will want to place this in the Survey Properties. Web Settings tab -> 'Additional head contents' field.

<script>
$(document).ready(function(){
	$('#buttonback').get(0).removeAttribute('onclick');
	$('#buttonback').click(function(){ document.forms[1].submit(); });
});
</script>

6:  Remove Submit Buttons

This script will remove an input completely from the page. Change the input ID to specify which button you'd like to remove from the screen.

VIEW DEMO

<script type="text/javascript"><!--
$(document).ready(function() {
     $('#buttonback').hide();
});
// --></script>

7:  Change Viewport for Mobile Devices

Kinesis Survey uses a default standard viewport for all mobile and tablet surveys, with user scaling (zooming and unzooming) disabled:

<meta name="viewport" content="initial-scale=1.0; maximum-scale=1.0; user-scalable=no">

In rare cases, a Matrix Table or Custom HTML Range can cause formatting issues on mobile devices. You can adjust the mobile viewport on an individual page by adding the following script call to your page:

<script type="text/JavaScript">
$(document).ready(function(){
$('head').append('<meta name="viewport" content="width=xxx, initial-scale=xxx, maximum-scale=xxx, user-scalable=xxx">');
});
</script>

Please note, Kinesis Survey is developed and tested with a specific viewport, and some features, questions and themes may behave differently if this is changed.

8:  Add Close Window Button

Adds a button that closes the active browser window. Useful for thank you pages or custom info pages such as "Terms & Conditions". Note: This will only work if the window/tab to be closed was originally opened using JavaScript.

<input onclick="javascript:self.close();" name="button" type="button" value="Close Window">

9:  Add Print Button

Creates a button that allows the respondent to print the contents of the page. Best when used with an Extra Text question specifically designed with print formatting in mind.

<input onclick="javascript:window.print()" class="button" type="button" value="Print this page">

10:  Record Time Viewing Page(s)

Stores the amount of time spent viewing a survey page with two hidden computational questions.

Procedure: First, a hidden computational should be inserted on the previous page. This question will return a timestamp value that represents the time that the subsequent page is first accessed:

return time();

Next, add a second hidden computational question on the following page. This question retrieves a timestamp value from the previous page and calculates the view time in seconds:

return time() - $Qvariable;

Replace $Qvariable in the above code with the datapoint holding the first computational question.

11:  Record Time Viewing Page Range

A similar method may be used to record time spent on multiple pages. Place the first computational question on the page before the first page you want to record. If you are recording a continuous range of pages, simply insert the second computational on the last page of this range. If the pages are broken up, record the times spent on each continuous segment of pages and add these values in the second computational of your last group, which should look similar to the following:

return $Qcomp2group1 + $Qcomp2group2 + (time() - $Qcomp1group3);

12:  Change Language Selection text displayed

You can use the following to alter the text shown on the Language Selection screen for any given item using the following JavaScript as an example. You will want to insert this directly onto the appropriate Info Page and be sure to change the value number to match with the corresponding option in the pulldown.

<script>
$(document).ready(function(){
     $('select#locale option[value="2"]').text('Gaga Goo Goo');
});
</script>
  • Was this article helpful?