Willkommen, Gast
Benutzername: Passwort: Angemeldet bleiben:

THEMA: Display number of rows in array question based on previous numerical input

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95371

  • ricardo
  • ricardos Avatar
  • OFFLINE
  • Expert Lime
  • Beiträge: 116
  • Dank erhalten: 1
  • Karma: 0
I'd like to create an array question that only displays certain number of rows based on a response to a previous numerical input.

In this example, if a person says that she teaches 2 courses (#1), question 2 should display only 2 rows (#2)


numberofrows_2013-04-26.PNG




is it possible to do this?

Thanks
Letzte Änderung: 1 Jahr 5 Monate her von ricardo. Begründung: wrong pic
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95385

  • tpartner
  • tpartners Avatar
  • OFFLINE
  • LimeSurvey Team
  • Beiträge: 4271
  • Dank erhalten: 806
  • Karma: 369
If both questions are on the same page as your image indicates, add this to the source of the numeric question.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
 
		// Identify the questions
		var q1ID = '{QID}';
		var q1 = $('#question'+q1ID+'');
		var q2 = $(q1).nextAll('.array-multi-flexi-text:eq(0)'); 
		var q2ID = $(q2).attr('id').split('question')[1];
 
		// Initial row handling
		handleRows($('input[type="text"]', q1));
 
		// Listener on the numeric input
		$('input[type="text"]', q1).change(function(){
			var maxRows = $('tr:[id^="javatbd"]', q2).length;
			if($(this).val() > maxRows) {
				alert('You can only display a maximum of '+maxRows+' rows!');
				$(this).val('');
			}
			else {
				handleRows(this);
			}
		});
 
		function handleRows(el) {
			var numRows = $(el).val();
			$('tr:[id^="javatbd"]', q2).hide();
			$('tr:[id^="javatbd"]', q2).each(function(i){
				if(i >= numRows) {
					$('input[type="text"], select', this).val('');
				}
				else {
					$(this).show();
				}
			})
		}
	});
</script>

Here's a sample survey:

Dateianhang:

Dateiname: limesurvey_survey_372272_2013-04-28.lss
Dateigröße: 19 KB
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95387

  • ricardo
  • ricardos Avatar
  • OFFLINE
  • Expert Lime
  • Beiträge: 116
  • Dank erhalten: 1
  • Karma: 0
As always, Thank you very much, Tony.

ricardo
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95391

  • tpartner
  • tpartners Avatar
  • OFFLINE
  • LimeSurvey Team
  • Beiträge: 4271
  • Dank erhalten: 806
  • Karma: 369
You're welcome :). Enjoy your Sunday.
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95763

  • ricardo
  • ricardos Avatar
  • OFFLINE
  • Expert Lime
  • Beiträge: 116
  • Dank erhalten: 1
  • Karma: 0
Hi Tony,

There small glitch in this workaround

The rows don't display as soon as the number is entered...they only show up after clicking somewhere else...is there a way to make the rows appear as soon as the number is entered.


rows.png


this is a link to the question broaderimpacts.org/surveys/limesurvey/index.php/289571/lang-en

rg
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95776

  • tpartner
  • tpartners Avatar
  • OFFLINE
  • LimeSurvey Team
  • Beiträge: 4271
  • Dank erhalten: 806
  • Karma: 369
That is not a "glitch", it is by design.

The handleRows() function is not fired until the respondent is finished inputting their value (the input is de-focussed) to avoid "bouncing" if you have more than 9 rows. (if someone enters 12, it would first show 2 rows and then 12)

If have less than 10 rows, change this:
$('input[type="text"]', q1).change(function(){

To this:
$('input[type="text"]', q1).mouseup(function(){
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95786

  • ricardo
  • ricardos Avatar
  • OFFLINE
  • Expert Lime
  • Beiträge: 116
  • Dank erhalten: 1
  • Karma: 0
thanks, Tony

Also, is it possible to make the array question mandatory? This is what it looks now. In this example, only info about 3 courses should be entered...but still the person gets the warning


mandatory.png
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 5 Monate her #95798

  • tpartner
  • tpartners Avatar
  • OFFLINE
  • LimeSurvey Team
  • Beiträge: 4271
  • Dank erhalten: 806
  • Karma: 369
The easiest way to handle that would be to populate all of the hidden text inputs with an "N/A" value.

So, the script in the "How many courses..." question would become:
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
 
		// Identify the questions
		var q1ID = '{QID}';
		var q1 = $('#question'+q1ID+'');
		var q2 = $(q1).nextAll('.array-multi-flexi-text:eq(0)'); 
		var q2ID = $(q2).attr('id').split('question')[1];
 
		// Initial row handling
		handleRows($('input[type="text"]', q1));
 
		// Listener on the numeric input
		$('input[type="text"]', q1).mouseup(function(){
			var maxRows = $('tr:[id^="javatbd"]', q2).length;
			if($(this).val() > maxRows) {
				alert('You can only display a maximum of '+maxRows+' rows!');
				$(this).val('');
			}
			else {
				handleRows(this);
			}
		});
 
		function handleRows(el) {
			var numRows = $(el).val();
			$('tr:[id^="javatbd"]', q2).hide();
			$('tr:[id^="javatbd"]', q2).each(function(i){
				if(i >= numRows) {
					$('input[type="text"], select', this).val('');
				}
				else {
					$(this).show();
				}
			})
		}
 
		// Interrupt next/submit function
		$('form#limesurvey').submit(function(){
 
			// Load hidden inputs
			$('.subquestions-list tr:hidden input[type="text"]', q2).val('N/A');
 
			// Carry on with submit
			return true;
		});
	});
</script>
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
Der Administrator hat öffentliche Schreibrechte deaktiviert.
Folgende Benutzer bedankten sich: oppur

Display number of rows in array question based on previous numerical input 1 Jahr 4 Monate her #96331

  • oppur
  • oppurs Avatar
  • OFFLINE
  • Fresh Lemon
  • Beiträge: 2
  • Karma: 0
tpartner schrieb:
If both questions are on the same page as your image indicates, add this to the source of the numeric question.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
 
		// Identify the questions
		var q1ID = '{QID}';
		var q1 = $('#question'+q1ID+'');
		var q2 = $(q1).nextAll('.array-multi-flexi-text:eq(0)'); 
		var q2ID = $(q2).attr('id').split('question')[1];
 
		// Initial row handling
		handleRows($('input[type="text"]', q1));
 
		// Listener on the numeric input
		$('input[type="text"]', q1).change(function(){
			var maxRows = $('tr:[id^="javatbd"]', q2).length;
			if($(this).val() > maxRows) {
				alert('You can only display a maximum of '+maxRows+' rows!');
				$(this).val('');
			}
			else {
				handleRows(this);
			}
		});
 
		function handleRows(el) {
			var numRows = $(el).val();
			$('tr:[id^="javatbd"]', q2).hide();
			$('tr:[id^="javatbd"]', q2).each(function(i){
				if(i >= numRows) {
					$('input[type="text"], select', this).val('');
				}
				else {
					$(this).show();
				}
			})
		}
	});
</script>

Here's a sample survey:

Dateianhang:

Dateiname: limesurvey_survey_372272_2013-04-28.lss
Dateigröße: 19 KB

Thank you. This work fine in Chrome, Safari, IE8. But not in IE10.
Der Administrator hat öffentliche Schreibrechte deaktiviert.

Display number of rows in array question based on previous numerical input 1 Jahr 4 Monate her #96350

  • oppur
  • oppurs Avatar
  • OFFLINE
  • Fresh Lemon
  • Beiträge: 2
  • Karma: 0
I found a temporary solution:
If I add to template startpage.pstpl
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
then this script work on IE10
Letzte Änderung: 1 Jahr 4 Monate her von oppur.
Der Administrator hat öffentliche Schreibrechte deaktiviert.
Moderatoren: ITEd
Ladezeit der Seite: 0.329 Sekunden
Donation Image