Array question with answers in dropdown list

Mehr
1 Monat 1 Woche her - 1 Monat 1 Woche her #173531 von anaidgh
anaidgh antwortete auf das Thema: Array question with answers in dropdown list
Hi, Tony, thanks for the fast answer, sorry i want to replay in the first post, the one with the next code:

<script type="text/javascript" charset="utf-8">

$(document).on('ready pjax:scriptcomplete',function(){

$('#question{QID} .answer_cell_SQ001 option[value=1]').text('No recurro');
$('#question{QID} .answer_cell_SQ001 option[value=2]').text('Arocena Gustavo');
$('#question{QID} .answer_cell_SQ001 option[value=3]').text('Aspra Manuel');
$('#question{QID} .answer_cell_SQ001 option[value=4]').text('Bravo Ricardo');
$('#question{QID} .answer_cell_SQ001 option[value=5]').text('Zalazar Martin');

$('#question{QID} .answer_cell_SQ002 option[value=1]').text('No recurro');
$('#question{QID} .answer_cell_SQ002 option[value=2]').text('Bravo Ricardo');
$('#question{QID} .answer_cell_SQ002 option[value=3]').text('Fernandez Flavio');
$('#question{QID} .answer_cell_SQ002 option[value=4]').text('Zalazar Martin');
$('#question{QID} .answer_cell_SQ002 option[value=5]').text('').hide();

});

</script>


I want to create this array, (with three types of inputs)
Anhang:
Letzte Änderung: 1 Monat 1 Woche her von anaidgh.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
1 Monat 1 Woche her - 1 Monat 1 Woche her #173576 von tpartner
tpartner antwortete auf das Thema: Array question with answers in dropdown list
Here is script that will manipulate an array-texts question as follows. You can adapt this to your needs.
  1. Leave row 1 as text inputs
  2. Place an identical drop-down in all cells of row 2
  3. Place a different identical drop-down in all cells of row 3
  4. Enforce numeric inputs in row 4


<script type="text/javascript" charset="utf-8">
 
	$(document).on('ready pjax:scriptcomplete',function(){
		var thisQuestion = $('#question{QID}');
 
		// Insert selects into row 2
		if($('tr.subquestion-list:eq(1) .answer-item .inserted-select', thisQuestion).length == 0) {
			$('tr.subquestion-list:eq(1) .answer-item', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
				<option value="">Please choose...</option>\
				<option value="1">Yes</option>\
				<option value="2">No</option>\
				<option value="3">Do not know</option>\
			</select>');
		} 
 
		// Insert selects into row 3
		if($('tr.subquestion-list:eq(2) .answer-item .inserted-select', thisQuestion).length == 0) {
			$('tr.subquestion-list:eq(2) .answer-item', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
				<option value="">Please choose...</option>\
				<option value="1">Red</option>\
				<option value="2">Blue</option>\
				<option value="3">Pink</option>\
				<option value="3">Purple</option>\
			</select>');  
		} 
 
		// Listeners on select elements
		$('.inserted-select', thisQuestion).on('change', function(i) {
			if($(this).val() != '') {
				$(this).closest('.answer-item').find('input:text').val($.trim($('option:selected', this).text())).trigger('change');
			}
			else {
				$(this).closest('.answer-item').find('input:text').val('').trigger('change');
			}
		});
 
		// Returning to page
		$('.with-select input:text', thisQuestion).each(function(i) {
			var thisCell = $(this).closest('.answer-item');
			var inputText = $.trim($(this).val());
			var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val();
			$('select.inserted-select', thisCell).val(selectval);
		});
 
		// Numerics only in row 4
		$('tr.subquestion-list:eq(3) input:text', thisQuestion).on('keyup change', function(e) {
			var thisValue = $.trim($(this).val());
			if($.isNumeric(thisValue) === false) {
 
				// Strip out non-numerics characters
				newValue = thisValue.replace(/\D/g,'');
				$(this).val(newValue).trigger('change');
			}
		});
 
		// Clean-up styles
		$('select.inserted-select', thisQuestion).css({
			'max-width': '100%'
		});
		$('.with-select input:text', thisQuestion).css({
			'position': 'absolute',
			'left': '-9999em'
		});
	});
</script>



Sample survey attached:

Dateianhang:

Dateiname: limesurvey...9-06.lss
Dateigröße:28 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Anhang:
Letzte Änderung: 1 Monat 1 Woche her von tpartner.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
1 Monat 1 Woche her #173578 von anaidgh
anaidgh antwortete auf das Thema: Array question with answers in dropdown list
Tony! Thank you so much!
It's works perfect! SEriouslly, ypu save me :)

Just one, last question, is it possible to, in the same array, condicionate the numeric row (row 4) to appear based on choosed option in row 3?

Regards

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
1 Monat 1 Woche her #173579 von tpartner
tpartner antwortete auf das Thema: Array question with answers in dropdown list
So, you only want to show a numeric input in row 4 if a specific value is selected in row 3?

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

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
1 Monat 1 Woche her #173580 von anaidgh
anaidgh antwortete auf das Thema: Array question with answers in dropdown list
That's right.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
1 Monat 1 Woche her #173587 von tpartner
tpartner antwortete auf das Thema: Array question with answers in dropdown list
This script will only show the input elements in row-4 if a specific value is selected in row 3. In this case, I have set the value to "4". Modify the "showValue" variable as required.

<script type="text/javascript" charset="utf-8">
 
	$(document).on('ready pjax:scriptcomplete',function(){
		var thisQuestion = $('#question{QID}');
 
		// Insert selects into row 2
		if($('tr.subquestion-list:eq(1) .answer-item .inserted-select', thisQuestion).length == 0) {
			$('tr.subquestion-list:eq(1) .answer-item', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
				<option value="">Please choose...</option>\
				<option value="1">Yes</option>\
				<option value="2">No</option>\
				<option value="3">Do not know</option>\
			</select>');
		} 
 
		// Insert selects into row 3
		if($('tr.subquestion-list:eq(2) .answer-item .inserted-select', thisQuestion).length == 0) {
			$('tr.subquestion-list:eq(2) .answer-item', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
				<option value="">Please choose...</option>\
				<option value="1">Red</option>\
				<option value="2">Blue</option>\
				<option value="3">Pink</option>\
				<option value="4">Show row-4 input</option>\
			</select>');  
		} 
 
		// Listeners on select elements
		$('.inserted-select', thisQuestion).on('change', function(i) {
			if($(this).val() != '') {
				$(this).closest('.answer-item').find('input:text').val($.trim($('option:selected', this).text())).trigger('change');
			}
			else {
				$(this).closest('.answer-item').find('input:text').val('').trigger('change');
			}
		});
 
		// Returning to page
		$('.with-select input:text', thisQuestion).each(function(i) {
			var thisCell = $(this).closest('.answer-item');
			var inputText = $.trim($(this).val());
			var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val();
			$('select.inserted-select', thisCell).val(selectval);
		});
 
		// Numeric only in row 4
		$('tr.subquestion-list:eq(3) input:text', thisQuestion).on('keyup change', function(e) {
			var thisValue = $.trim($(this).val());
			if($.isNumeric(thisValue) === false) {
 
				// Strip out non-numerics characters
				newValue = thisValue.replace(/\D/g,'');
				$(this).val(newValue);
				checkconditions($(this).val(), $(this).attr('name'), 'text');
			}
		});
 
		// Hide row-4 inputs unless a specific value selected in row 3
		var showValue = '4';
		// Listener on row-3 selects
		$('tr.subquestion-list:eq(2) select', thisQuestion).on('change', function(e) {
			var thisValue = $(this).val();
			var thisCode = $(this).closest('.answer-item').find('input:text').attr('id').split('_')[1];
			var otherInput = $('tr.subquestion-list:eq(3) .answer_cell_'+thisCode+' input:text', thisQuestion);
			if(thisValue == showValue) {
				$(otherInput).show();
			}
			else {
				$(otherInput).hide().val('');
				checkconditions($(otherInput).val(), $(otherInput).attr('name'), 'text');
			}
		});
		// Initial states of row-4 inputs
		$('tr.subquestion-list:eq(3) input:text', thisQuestion).hide();
		$('tr.subquestion-list:eq(2) .inserted-select', thisQuestion).each(function(i) {
			var thisValue = $(this).val();
			var thisCode = $(this).closest('.answer-item').find('input:text').attr('id').split('_')[1];
			var otherInput = $('tr.subquestion-list:eq(3) .answer_cell_'+thisCode+' input:text', thisQuestion);
			if(thisValue == showValue) {
				$('tr.subquestion-list:eq(3) .answer_cell_'+thisCode+' input:text', thisQuestion).show();
			}
		});
 
		// Clean-up styles
		$('select.inserted-select', thisQuestion).css({
			'max-width': '100%'
		});
		$('.with-select input:text', thisQuestion).css({
			'position': 'absolute',
			'left': '-9999em'
		});
	});
</script>

Sample survey attached:

Dateianhang:

Dateiname: limesurvey...8863.lss
Dateigröße:29 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Anhang:

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
1 Monat 1 Woche her #173660 von anaidgh
anaidgh antwortete auf das Thema: Array question with answers in dropdown list
Thank you, so much, Tony.

The last question, I tried to make the same (numeric and text array) but now with columns, i.e. First column is just numeric and the second one text. So, I supposed it would be like this...

<script type="text/javascript" charset="utf-8">

$(document).on('ready pjax:scriptcomplete',function(){
var thisQuestion = $('#question{3}');
// Numerics only in row 4
$('.answer_cell_SQ001 input:text', thisQuestion).on('keyup change', function(e) {
var thisValue = $.trim($(this).val());
if($.isNumeric(thisValue) === false) {

// Strip out non-numerics characters
newValue = thisValue.replace(/\D/g,'');
$(this).val(newValue).trigger('change');
}
});
// Clean-up styles
$('select.inserted-select', thisQuestion).css({
'max-width': '100%'
});
$('.with-select input:text', thisQuestion).css({
'position': 'absolute',
'left': '-9999em'
});


// Assign column-specific classes
$('table.subquestion-list tr', thisQuestion).each(function(i) {

$('> *:gt(0)', this).each(function(i){
$(this).addClass('column-'+(i+1));
$(this).attr('data-column', i+1);
});



});

</script>

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Jetzt loslegen!

Melden Sie sich jetzt an, und erstellen Sie in wenigen Minuten Ihre erste Umfrage.

Account einrichten

Abonnieren Sie unseren Newsletter

Abonnieren Sie unseren Newsletter für alle Neuigkeiten rund um LimeSurvey
captcha