- Posts: 8
- Thank you received: 0
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Filling multiple gaps in a sentence using text boxes?
- confusedeconomist
- Topic Author
- Offline
- New Member
Less
More
3 years 1 month ago #212517
by confusedeconomist
Filling multiple gaps in a sentence using text boxes? was created by confusedeconomist
Hi everyone,
I want to make a question which asks my survey participants to fill in the gaps in the following sentences (using numbers to report hours and minutes):
Over the past WEEK: I have spent ___ hours and ___ minutes doing this activity.
Over the past MONTH: I have spent ___ hours and ___ minutes doing this activity.
Over the past YEAR: I have spent ___ hours and ___ minutes doing this activity.
I have tried to do this via the "multiple short text" question type, the result is attached as a picture.
To do so, I set "Over the past XXX:" as my subquestions, "I have spent" as my prefix, and "doing this activity" as my suffix.
However, it doesn't seem possible to add a second box for participants to fill in the "minutes" in the same line. Does anyone know how to do this please?
I tried some different ways too, like using an array with two columns (one for hours one for minutes) but this doesn't allow for prefix/suffix, and doesn't look as nice.
I have never tried to change source codes or used Javascript before, but I would be super grateful for any advice on how to do so, if you think it can solve my problem above!
Best wishes,
Lucie
I want to make a question which asks my survey participants to fill in the gaps in the following sentences (using numbers to report hours and minutes):
Over the past WEEK: I have spent ___ hours and ___ minutes doing this activity.
Over the past MONTH: I have spent ___ hours and ___ minutes doing this activity.
Over the past YEAR: I have spent ___ hours and ___ minutes doing this activity.
I have tried to do this via the "multiple short text" question type, the result is attached as a picture.
To do so, I set "Over the past XXX:" as my subquestions, "I have spent" as my prefix, and "doing this activity" as my suffix.
However, it doesn't seem possible to add a second box for participants to fill in the "minutes" in the same line. Does anyone know how to do this please?
I tried some different ways too, like using an array with two columns (one for hours one for minutes) but this doesn't allow for prefix/suffix, and doesn't look as nice.
I have never tried to change source codes or used Javascript before, but I would be super grateful for any advice on how to do so, if you think it can solve my problem above!
Best wishes,
Lucie
Attachments:
The topic has been locked.
- Joffm
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 12881
- Thank you received: 3965
3 years 1 month ago #212520
by Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Replied by Joffm on topic Filling multiple gaps in a sentence using text boxes?
Hi, Lucie,
have a look here
[url] forums.limesurvey.org/forum/can-i-do-thi...down-box-within-text [/url]
It's for dropdowns, but
in your case you may use drop-downs (0 - 24 hours), (0 to 60 minutes)
Or you change the javascript and the question type from checkbox to "short text" or "numeric input"
Or a - in my opinion - better way is to use an array(numbers)
Joffm
have a look here
[url] forums.limesurvey.org/forum/can-i-do-thi...down-box-within-text [/url]
It's for dropdowns, but
in your case you may use drop-downs (0 - 24 hours), (0 to 60 minutes)
Or you change the javascript and the question type from checkbox to "short text" or "numeric input"
Code:
<script type="text/javascript" charset="utf-8"> $(document).on('ready',function(){ var thisSelect = $('#question{QID} input[id^="answer"]:eq(0)'); var secondSelect = $('#question{QID}').nextAll('[id^="question"]:eq(0)').find('input[id^="answer"]:eq(0)'); // Move the first dropdown $('#question{QID} .inserted-dropdown:eq(0)').append(thisSelect); // Move the second dropdown $('#question{QID} .inserted-dropdown:eq(1)').append(secondSelect ); // Hide the next question $('#question{QID}').nextAll('[id^="question"]:eq(0)').hide(); }); </script> <style type="text/css">#question{QID} select { margin: 0 0 0 -0.25em; } </style> <style type="text/css">#question{QID} input { display: inline-block; margin: 0 0 0 -0.25em; width: 50px; height: auto; padding: 0; } #question{QID} .answer-container{ display: none; } </style>
Or a - in my opinion - better way is to use an array(numbers)
Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: confusedeconomist
The topic has been locked.
- confusedeconomist
- Topic Author
- Offline
- New Member
Less
More
- Posts: 8
- Thank you received: 0
3 years 1 month ago #212525
by confusedeconomist
Replied by confusedeconomist on topic Filling multiple gaps in a sentence using text boxes?
Hi Joffm,
Thank you so much for your answer!
I hadn't considered the "array" format for this question before, but I think you're right, this makes a lot more sense. I have no experience with Javascript (or with coding in general) so it might also be the safest option for me since I don't have to touch the source code!
Best wishes,
Lucie
Thank you so much for your answer!
I hadn't considered the "array" format for this question before, but I think you're right, this makes a lot more sense. I have no experience with Javascript (or with coding in general) so it might also be the safest option for me since I don't have to touch the source code!
Best wishes,
Lucie
The topic has been locked.
- confusedeconomist
- Topic Author
- Offline
- New Member
Less
More
- Posts: 8
- Thank you received: 0
3 years 1 month ago #212736
by confusedeconomist
Replied by confusedeconomist on topic Filling multiple gaps in a sentence using text boxes?
Hi Joffm,
Apologies for going back to you, but I find myself in a bind again.
Basically after testing the question with a few people, I've concluded that it's too confusing for them to be asked about all three time periods. Instead, I want to give them a choice of answering the question using the timescale they prefer (weekly, monthly, or yearly).
Hence the ideal question would be:
"On an average (dropdown: week / month / year), I spend about (dropdown: 0-250) hours and (dropdown: 0-59) minutes doing this task."
This means I need 3 dropdowns in my question, instead of 2 as in the code you linked me to.
I'm not a programmer and I don't know Javascript at all but I can see that I likely need to change 3 lines in the code:
- the line that defines "thirdSelect"
- the line that appends the third question's dropdown
- the line that hides the third question
If you have a bit of time, I'd really appreciate advice on how to add these three lines. I did my own googling but I am stuck (as I don't know Javascript). For example I don't know how to refer to "the question two questions from now" in the code so I can't create thirdSelect.
Thanks a million in advance for any help!
Apologies for going back to you, but I find myself in a bind again.
Basically after testing the question with a few people, I've concluded that it's too confusing for them to be asked about all three time periods. Instead, I want to give them a choice of answering the question using the timescale they prefer (weekly, monthly, or yearly).
Hence the ideal question would be:
"On an average (dropdown: week / month / year), I spend about (dropdown: 0-250) hours and (dropdown: 0-59) minutes doing this task."
This means I need 3 dropdowns in my question, instead of 2 as in the code you linked me to.
I'm not a programmer and I don't know Javascript at all but I can see that I likely need to change 3 lines in the code:
- the line that defines "thirdSelect"
- the line that appends the third question's dropdown
- the line that hides the third question
If you have a bit of time, I'd really appreciate advice on how to add these three lines. I did my own googling but I am stuck (as I don't know Javascript). For example I don't know how to refer to "the question two questions from now" in the code so I can't create thirdSelect.
Thanks a million in advance for any help!
The topic has been locked.
- Joffm
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 12881
- Thank you received: 3965
3 years 1 month ago #212742
by Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Replied by Joffm on topic Filling multiple gaps in a sentence using text boxes?
Yes, you can do that
You see how the "secondSelect" is defined and how the "eq(x)" is used.
BUT: Do you really thing it is advisable to have a drop-down from 0-250?
Meaning, who remembers the exact number? Was it 130 or 150? And minutes in a year?
Instead of this all, you may use a simple array with a drop-down in the first column and two text fields to enter hours and minutes
Like this
This you do by inserting this javascript snippet into the question code (you see I coded the x-axis "X001", "X002", "X003")
Joffm
You see how the "secondSelect" is defined and how the "eq(x)" is used.
BUT: Do you really thing it is advisable to have a drop-down from 0-250?
Meaning, who remembers the exact number? Was it 130 or 150? And minutes in a year?
Instead of this all, you may use a simple array with a drop-down in the first column and two text fields to enter hours and minutes
Like this
This you do by inserting this javascript snippet into the question code (you see I coded the x-axis "X001", "X002", "X003")
Code:
<script type="text/javascript" charset="utf-8"> $(document).on('ready pjax:scriptcomplete',function(){ var thisQuestion = $('#question{QID}'); // Add a question class thisQuestion.addClass('custom-array'); // Column-specific classes $('table.subquestion-list tr', thisQuestion).each(function(i) { $('th, td', this).each(function(i) { $(this).addClass('column-'+i); }); }); // Insert selects $('.answer-item.answer_cell_X003', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\ <option value="">...</option>\ <option value="1">week</option>\ <option value="2">month</option>\ <option value="3">year</option>\ </select>'); // Listeners $('.inserted-select', thisQuestion).on('change', function(i) { if($(this).val() != '') { $(this).closest('.answer-item').find('input:text').val($('option:selected', this).val()).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()); $('select.inserted-select', thisCell).val(inputText); }); // Clean-up styles $('select.inserted-select', thisQuestion).css({ 'max-width': '100%' }); $('.with-select input:text', thisQuestion).css({ 'position': 'absolute', 'left': '-9999em' }); }); </script>
Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: confusedeconomist
The topic has been locked.
- confusedeconomist
- Topic Author
- Offline
- New Member
Less
More
- Posts: 8
- Thank you received: 0
3 years 1 month ago #212747
by confusedeconomist
Replied by confusedeconomist on topic Filling multiple gaps in a sentence using text boxes?
Hi Joffm,
Thank you so much for your quick and thorough answer - I can't express how grateful I am, as I am completely lost when it comes to coding!
How can I see the secondselect and eq(x) you mention above? When I look at your message I just see the screenshot of the working survey but no code/sample survey.
I think that's a fair suggestion, and I want to try out both versions on some participants to see what they find easier to understand/answer. I copied your code into a new "array - text" style question, and added the relevant x-axis and y-axis subquestions. However when I preview the question it's as if the extra code wasn't there (the array just displays "normally" with three text boxes). Did you mean that I should replace the x001, x002, x003 with the name of my subquestions instead? Otherwise I'm not sure why I can't get the code to work.
Best wishes,
Lucie
Thank you so much for your quick and thorough answer - I can't express how grateful I am, as I am completely lost when it comes to coding!
You see how the "secondSelect" is defined and how the "eq(x)" is used.
How can I see the secondselect and eq(x) you mention above? When I look at your message I just see the screenshot of the working survey but no code/sample survey.
Instead of this all, you may use a simple array with a drop-down in the first column and two text fields to enter hours and minutes
I think that's a fair suggestion, and I want to try out both versions on some participants to see what they find easier to understand/answer. I copied your code into a new "array - text" style question, and added the relevant x-axis and y-axis subquestions. However when I preview the question it's as if the extra code wasn't there (the array just displays "normally" with three text boxes). Did you mean that I should replace the x001, x002, x003 with the name of my subquestions instead? Otherwise I'm not sure why I can't get the code to work.
Best wishes,
Lucie
The topic has been locked.
- Joffm
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 12881
- Thank you received: 3965
3 years 1 month ago - 3 years 1 month ago #212752
by Joffm
There you find the javascript of the inserted drop-downs.
In my opinion it is less confusing to code the y.axis as "Y001", "Y002",... and the x-axis as "X001", "X002".
In your dataset you do not find something like "Q23_SQ002_SQ003" (what was the x-axis, what the y-axis?) but "Q23_Y002_X003".
Therefore the javascript depends on an x-axis code of "X001", "X002", "X003".
Joffm
Now start creating your survey.
If there are more questions, please provide your work as lss export.
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Replied by Joffm on topic Filling multiple gaps in a sentence using text boxes?
This you find in my very first posting.How can I see the secondselect and eq(x) you mention above?
There you find the javascript of the inserted drop-downs.
By default LimeSurvey offers the codes of both the y-axis and x-axis as "SQ001", "SQ002"Did you mean that I should replace the x001, x002, x003
In my opinion it is less confusing to code the y.axis as "Y001", "Y002",... and the x-axis as "X001", "X002".
In your dataset you do not find something like "Q23_SQ002_SQ003" (what was the x-axis, what the y-axis?) but "Q23_Y002_X003".
Therefore the javascript depends on an x-axis code of "X001", "X002", "X003".
Joffm
Now start creating your survey.
If there are more questions, please provide your work as lss export.
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 3 years 1 month ago by Joffm.
The following user(s) said Thank You: confusedeconomist
The topic has been locked.
- confusedeconomist
- Topic Author
- Offline
- New Member
Less
More
- Posts: 8
- Thank you received: 0
3 years 1 month ago #212761
by confusedeconomist
Replied by confusedeconomist on topic Filling multiple gaps in a sentence using text boxes?
Ah I see, thank you very much for clarifying! Appreciate all the help I'll implement this in my survey now.
The topic has been locked.