Dropdown in Multiple short text

More
5 years 5 months ago #95283 by ricardo01
ricardo01 replied the topic: Dropdown in Multiple short text
Thanks, it worked...are you talking about this line?




I thought java scripts were immune to that?

cheers,

ricardo
Attachments:

Please Log in or Create an account to join the conversation.

More
5 years 5 months ago - 5 years 5 months ago #95297 by tpartner
tpartner replied the topic: Dropdown in Multiple short text

...are you talking about this line?

Yes.

I thought java scripts were immune to that?

Not when you have a variable (string) which spans several lines. In that case, every line must end with a backslash character '\'. You could put the whole string on one line but it would be kinda hard to read.

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last Edit: 5 years 5 months ago by tpartner.

Please Log in or Create an account to join the conversation.

More
5 years 5 months ago #95300 by ricardo01
ricardo01 replied the topic: Dropdown in Multiple short text
Thanks, Tony.

Please Log in or Create an account to join the conversation.

More
5 years 5 months ago - 5 years 5 months ago #95322 by Limer2001
Limer2001 replied the topic: Dropdown in Multiple short text
Can you (Ricardo,Tony?) post a limesurvey question file or survey file of this working. I can't get it to work.
Last Edit: 5 years 5 months ago by Limer2001.

Please Log in or Create an account to join the conversation.

More
5 years 5 months ago #95324 by tpartner
tpartner replied the topic: Dropdown in Multiple short text
Here you go. For portability, in this test survey I replaced the question ID (9334) with the {QID} placeholder.

File Attachment:

File Name: limesurvey...9411.lss
File Size:16 KB

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

Please Log in or Create an account to join the conversation.

More
5 years 5 months ago #95330 by Limer2001
Limer2001 replied the topic: Dropdown in Multiple short text
Thank you so much. With the QID placeholder it's working!

Please Log in or Create an account to join the conversation.

More
2 years 11 months ago #128124 by petergi
petergi replied the topic: Dropdown in Multiple short text
Hi all,
the solution presented by tpartner is going into the direction I am looking for, i.e. embedding drop downs into possible answers. However, what I need is to place the drop down not at the end of an answer but rather somewhere in the sentence.
Example:

'I am looking for <dropdown> a / the </dropdown> solution.'

The user then has to select his answer only through the drop down.

Any hint for a solution is greatly appreciated.

Thanks
Peter

Please Log in or Create an account to join the conversation.

More
1 year 1 month ago #158512 by ColinBrose
ColinBrose replied the topic: Dropdown in Multiple short text
Hi Tony,

Thanks for your solution. I copied your script into the source of the corresponding question but for some reason, it there is no change to the short text field in row 2, which I want to replace with a dropdown:

<p><span style="font-size:18px;">FRAGEBOGEN</span></p>
<script type="text/javascript" charset="utf-8">

$(document).ready(function() {

var qID = 134;
var inputNum = 2;

// Define the select element (dropdown)
var select1 = '<select id="select1"> \
<option value="">-- Please Choose --</option> \
<option value="Apples">Apples</option> \
<option value="Oranges">Oranges</option> \
<option value="Pears">Pears</option> \
<option value="Bananas">Bananas</option> \
</select>';

// Hide the text input
$('#question'+qID+' li:eq('+(inputNum-1)+') input.text').hide().parent().hide();

// Insert the select elements
$('#question'+qID+' li:eq('+(inputNum-1)+')').append(select1);

// Initially select an option if the question has already been answered
if($('#question'+qID+' li:eq('+(inputNum-1)+') input.text').val()) {
$('#question'+qID+' li:eq('+(inputNum-1)+') select').val($('#question'+qID+' li:eq('+(inputNum-1)+') input.text').val())
}

// Listener on the dropdowns - insert selected values into hidden text input
$('#question'+qID+' select').change(function() {
$(this).siblings('span').children('input.text').val($(this).val());
});

// Some styles
$('#question'+qID+' select').css({
'margin':'0.3em 0 0 1em'
});
});

</script>


Do you have any Ideas? Has anything changed for Version 2.67.3?

Thanks!

Please Log in or Create an account to join the conversation.

More
1 year 1 month ago #158539 by tpartner
tpartner replied the topic: Dropdown in Multiple short text
This is a 4-year-old thread so, yes, many things have changed.

Please start a new thread explaining exactly what you want to achieve.

Having said that, I am on vacation, responding via phone, so will not be able to contribute any code for at least 2 weeks.

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: DenisChenu

Please Log in or Create an account to join the conversation.

More
1 year 1 month ago #158573 by ColinBrose
ColinBrose replied the topic: Dropdown in Multiple short text
Thanks for the hint, have a nice holiday!

Please Log in or Create an account to join the conversation.

More
1 month 3 weeks ago #173137 by Minstrel72
Minstrel72 replied the topic: Dropdown in Multiple short text
Hi all.
I had this workaround working up to 2.73. Now in 3.x it is not working anymore, I believe that the different structure of the template has some role in it.
I used the following code to hide the textbox for a certain subquestion (inputNum) of the multiple short text question

$('#question'+qID+' div.question-item:eq('+(inputNum-1)+') input.text').hide();

and the following to change it with a dropdown list (in this case named "prov1")

$('#question'+qID+' div.question-item:eq('+(inputNum-1)+') input.text').before(prov1);

Could you please tell me what I should change to make this work again ?

I suspect it is the "div" part put dunno understand how to fix it.

Thank you very much!

Please Log in or Create an account to join the conversation.

More
1 month 3 weeks ago #173139 by tpartner
tpartner replied the topic: Dropdown in Multiple short text
Can you provide the complete script that you have added?

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

Please Log in or Create an account to join the conversation.

More
1 month 3 weeks ago #173141 by Minstrel72
Minstrel72 replied the topic: Dropdown in Multiple short text
Absolutely yes!
It follows. I have just shortened the full lists of items in the dropdown box as they are really long.
Please note that I have also chenged the $(document) code for v 3.0.
Thank you very much!

What is your current address ? <script type="text/javascript" charset="utf-8">
$(document).on('ready pjax:complete',function()
{
var qID = 453;
var inputNum = 4;
// Define the select element (dropdown)
var prov1 = '<select id="prov1" class="form-control list-question-select">\
<option value="">-- Choose the province --</option>\
<option value="P1">PROVA</option>\
<option value="P2">PROVB</option>\
<option value="P3">PROVC</option>\
<option value="P4">PROVD</option>\
<option value="P5">PROVE</option>\
<option value="P6">PROVF</option>\
<option value="P7">PROVG</option>\
</select>';
// Hide the text input
$('#question'+qID+' div.question-item:eq('+(inputNum-1)+') input.text').hide();

// Insert the select elements
$('#question'+qID+' div.question-item:eq('+(inputNum-1)+') input.text').before(prov1);

// Initially select an option if the question has already been answered
if($('#question'+qID+' div.question-item:eq('+(inputNum-1)+') input.text').val()) {
$('#question'+qID+' div.question-item:eq('+(inputNum-1)+') select').val($('#question'+qID+' div.question-item:eq('+(inputNum-1)+') input.text').val());
}
// Listener on the dropdowns - insert selected values into hidden text input
$('#question'+qID+' select').change(function() {
$(this).next('input.text').val($(this).val());
});
// Some styles
$('#question'+qID+' select').css({
'margin':'0.3em 0 0 1em'
});
var qID2 = 453;
var inputNum2 = 5;
// Define the select element (dropdown)
var select1 = '<select id="select1" class="form-control list-question-select"> \
<option value="">-- Choose the country --</option> \
<option value="AF">Afghanistan</option>\
<option value="AL">Albania</option>\
<option value="DZ">Algeria</option>\
<option value="AD">Andorra</option>\
<option value="AO">Angola</option>\
<option value="AI">Anguilla</option>\
<option value="AQ">Antartide</option>\
</select>';
// Hide the text input
$('#question'+qID2+' div.question-item:eq('+(inputNum2-1)+') input.text').hide();
// Insert the select elements
$('#question'+qID2+' div.question-item:eq('+(inputNum2-1)+') input.text').before(select1);

// Initially select an option if the question has already been answered
if($('#question'+qID2+' div.question-item:eq('+(inputNum2-1)+') input.text').val()) {
$('#question'+qID2+' div.question-item:eq('+(inputNum2-1)+') select').val($('#question'+qID2+' div.answer-container:eq('+(inputNum2-1)+') input.text').val());
}
// Listener on the dropdowns - insert selected values into hidden text input
$('#question'+qID2+' select').change(function() {
$(this).next('input.text').val($(this).val());
});
// Some styles
$('#question'+qID2+' select').css({
'margin':'0.3em 0 0 1em'
});
});
</script>

Please Log in or Create an account to join the conversation.

More
1 month 3 weeks ago #173142 by Minstrel72
Minstrel72 replied the topic: Dropdown in Multiple short text
Sorry for the double post. Obviously, the qid/inputnum is related to my specific survey.

Please Log in or Create an account to join the conversation.

More
1 month 3 weeks ago #173149 by tpartner
tpartner replied the topic: Dropdown in Multiple short text
Try this:

<script type="text/javascript" charset="utf-8">$(document).on('ready pjax:complete',function()	{
		var qID = {QID};		
		var inputNum = 4;
 
		// Define the select element (dropdown)
		var prov1 = '<select id="prov1" class="form-control">\
						<option value="">-- Choose the province --</option>\
						<option value="P1">PROVA</option>\
						<option value="P2">PROVB</option>\
						<option value="P3">PROVC</option>\
						<option value="P4">PROVD</option>\
						<option value="P5">PROVE</option>\
						<option value="P6">PROVF</option>\
						<option value="P7">PROVG</option>\
					</select>';
 
		// Hide the text input
		$('#question'+qID+' .question-item:eq('+(inputNum-1)+') input[type="text"]').hide();
 
		// Insert the select elements
		if($('#question'+qID+' .question-item:eq('+(inputNum-1)+') select').length == 0) {
			$('#question'+qID+' .question-item:eq('+(inputNum-1)+') input[type="text"]').before(prov1);
		}		
 
		var inputNum2 = 5;
 
		// Define the select element (dropdown)
		var select1 = '<select id="select1" class="form-control"> \
							<option value="">-- Choose the country --</option> \
							<option value="AF">Afghanistan</option>\
							<option value="AL">Albania</option>\
							<option value="DZ">Algeria</option>\
							<option value="AD">Andorra</option>\
							<option value="AO">Angola</option>\
							<option value="AI">Anguilla</option>\
							<option value="AQ">Antartide</option>\
						</select>';
 
		// Hide the text input
		$('#question'+qID+' .question-item:eq('+(inputNum2-1)+') input[type="text"]').hide();
 
		// Insert the select elements
		if($('#question'+qID+' .question-item:eq('+(inputNum2-1)+') select').length == 0) {
			$('#question'+qID+' .question-item:eq('+(inputNum2-1)+') input[type="text"]').before(select1);
		}		
 
		// Initially select an option if the question has already been answered
		$('#question'+qID+' select').each(function(i) {
			if($.trim($(this).next('input[type="text"]').val()) != '') {
				$(this).val($.trim($(this).next('input[type="text"]').val()));
			}
		});
 
		// Listener on the dropdowns - insert selected values into hidden text input
		$('#question'+qID+' select').change(function() {
			$(this).next('input[type="text"]').val($(this).val()).trigger('change');
		});
 
		// Some styles
		$('#question'+qID+' select').css({
		'margin':'0.3em 0 0 0'
		});
	});
</script>

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

Please Log in or Create an account to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!