Difference between revisions of "Hide Next button in n seconds"

From Catglobe Wiki
Jump to: navigation, search
 
(6 intermediate revisions by one other user not shown)
Line 1: Line 1:
 
== Challenge  ==
 
== Challenge  ==
  
−
In order to not allow respondent click on the Next button in a period of t<br>As a questionnaire creator<br>I want to hide the Next button in some seconds&nbsp;
+
In order to not allow respondent click on the Next button in a period of time
  
−
== Solution  ==
+
As a questionnaire creator
  
−
*In questionnaire template editor, choose the&nbsp;question&nbsp;I want to hide the Next button,&nbsp;and then&nbsp;go to the Properties - Edit question properties - Language dependent - Select javascript property&nbsp;
+
I want to hide the Next button in some seconds&nbsp;
−
*Create a onInit() function.
 
−
*In that function, check if the Next button existed.&nbsp;
 
−
*If it doesn't exist, do nothing, else disable the Next button, set the time&nbsp;out to number of seconds&nbsp;I want to hide the&nbsp;button, then show the button again.&nbsp;&nbsp;
 
  
−
== Code  ==
+
== Example ==
 +
[[Image:HideNextButton1.jpg]]
 +
<br>
 +
[[Image:HideNextButton2.jpg]]
  
−
&lt;source lang="javascript" line="1"&gt;quest.onInit = function()<br>{<br>var secsTimeout = 10;
+
== Solution  ==
  
−
if ( !document.getElementsByName('next') || document.getElementsByName('next').length == 0 ) <br>{<br>// next button not available<br>return;<br>}<br>else<br>{<br>document.getElementsByName('next')[0].style.display='none';<br>}
+
*In questionnaire template editor, choose the question I want to hide the Next button and then go to the Properties - Edit question properties - Language dependent - Select javascript property
 +
*Override quest.onInit function.  
 +
*In that function, check if the Next button exists.  
 +
*If it doesn't exist, do nothing, else disable the Next button, set the time out to number of seconds I want to hide the button, then show the button again.
  
−
var timeout = setTimeout("document.getElementsByName('next')[0].style.display='';", secsTimeout*1000);
+
[[Image:HideNextButton Code.jpg]]
 +
== Code  ==
 +
<source lang="javascript">
 +
quest.onInit = function()
 +
{
 +
var secsTimeout = 10;
 +
if ( !document.getElementsByName('next') || document.getElementsByName('next').length == 0 )
 +
// next button not available
 +
return;
 +
document.getElementsByName('next')[0].style.display='none';
 +
setTimeout("document.getElementsByName('next')[0].style.display='';", secsTimeout*1000);
 +
}
 +
</source>
  
−
}&lt;/source&gt;
+
== Source ==
 +
Questionnaire Resource Id on cg site: 159730

Latest revision as of 05:58, 2 February 2012

Challenge

In order to not allow respondent click on the Next button in a period of time

As a questionnaire creator

I want to hide the Next button in some seconds 

Example

HideNextButton1.jpg
HideNextButton2.jpg

Solution

  • In questionnaire template editor, choose the question I want to hide the Next button and then go to the Properties - Edit question properties - Language dependent - Select javascript property
  • Override quest.onInit function.
  • In that function, check if the Next button exists.
  • If it doesn't exist, do nothing, else disable the Next button, set the time out to number of seconds I want to hide the button, then show the button again.

HideNextButton Code.jpg

Code

quest.onInit = function()
{
	var secsTimeout = 10;
	if ( !document.getElementsByName('next') || document.getElementsByName('next').length == 0 ) 
		// next button not available
		return;
	document.getElementsByName('next')[0].style.display='none';
	setTimeout("document.getElementsByName('next')[0].style.display='';", secsTimeout*1000);
}

Source

Questionnaire Resource Id on cg site: 159730

Retrieved from "http://wiki.catglobe.com/index.php?title=Hide_Next_button_in_n_seconds&oldid=23779"