Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Dropdown in Multiple short text

More
10 years 11 months ago #95330 by Limer2001
Replied by Limer2001 on topic Dropdown in Multiple short text
Thank you so much. With the QID placeholder it's working!
The topic has been locked.
More
8 years 4 months ago #128124 by petergi
Replied by petergi on 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
The topic has been locked.
More
6 years 6 months ago #158512 by ColinBrose
Replied by ColinBrose on 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!
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 6 months ago #158539 by tpartner
Replied by tpartner on 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
The topic has been locked.
More
6 years 6 months ago #158573 by ColinBrose
Replied by ColinBrose on topic Dropdown in Multiple short text
Thanks for the hint, have a nice holiday!
The topic has been locked.
More
5 years 6 months ago #173137 by Minstrel72
Replied by Minstrel72 on 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!
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
5 years 6 months ago #173139 by tpartner
Replied by tpartner on 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.
The topic has been locked.
More
5 years 6 months ago #173141 by Minstrel72
Replied by Minstrel72 on 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>
The topic has been locked.
More
5 years 6 months ago #173142 by Minstrel72
Replied by Minstrel72 on topic Dropdown in Multiple short text
Sorry for the double post. Obviously, the qid/inputnum is related to my specific survey.
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
5 years 6 months ago #173149 by tpartner
Replied by tpartner on topic Dropdown in Multiple short text
Try this:

Code:
<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.
The following user(s) said Thank You: duvemyster, f_funke
The topic has been locked.
More
5 years 6 months ago #173151 by Minstrel72
Replied by Minstrel72 on topic Dropdown in Multiple short text
It works !!! And it is much more efficient than before.
Thank you very much Tony, I think that this could be added again to the workarounds for 3.x
All the best!
The following user(s) said Thank You: raminnaimi
The topic has been locked.
More
3 years 10 months ago #199839 by raminnaimi
Replied by raminnaimi on topic Dropdown in Multiple short text
Perfect! This worked for me too... life saver! Thank you!
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose