- Posts: 4
- Thank you received: 0
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Deselect Radio Button In Array
- camino
- Topic Author
- Offline
- New Member
Less
More
4 months 2 weeks ago #253219
by camino
Deselect Radio Button In Array was created by camino
Hello,
I already found several threads in this forum regarding this topic, but non yielded a viable solution for my case. What I need is an easy and flexible javascript solution to make radio buttons in an array deselectable.
I know that is not the 'purpose' of radio buttons and there is a workaround using checkboxes, but the output is more messy then and for this study we want radio buttons. I know, that you can use a reset button, which we do not want to use either. Also using a 'no answer' option is not viable for our study design.
After searching through the web and trying several different approaches, I found this one, which kinda works. The only problem is that when active you can only select the radio buttons by clicking directly onto them (and not by clicking on the answer cell) and by clicking on any answer cell the radio button in that row will become unchecked. Any ideas on how to get this to work properly or maybe different approach to this problem?
I already found several threads in this forum regarding this topic, but non yielded a viable solution for my case. What I need is an easy and flexible javascript solution to make radio buttons in an array deselectable.
I know that is not the 'purpose' of radio buttons and there is a workaround using checkboxes, but the output is more messy then and for this study we want radio buttons. I know, that you can use a reset button, which we do not want to use either. Also using a 'no answer' option is not viable for our study design.
After searching through the web and trying several different approaches, I found this one, which kinda works. The only problem is that when active you can only select the radio buttons by clicking directly onto them (and not by clicking on the answer cell) and by clicking on any answer cell the radio button in that row will become unchecked. Any ideas on how to get this to work properly or maybe different approach to this problem?
Code:
$(function(){ var $radios = $('input[type="radio"]'); $radios.click(function () { var $this = $(this); if ($this.data('checked')) { this.checked = false; } var $otherRadios = $radios.not($this).filter('[name="' + $this.attr('name') + '"]'); $otherRadios.prop('checked', false).data('checked', false); $this.data('checked', this.checked); }); });
Please Log in to join the conversation.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10109
- Thank you received: 3595
4 months 2 weeks ago #253229
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Deselect Radio Button In Array
Well, you removed the questions about your LimeSurvey installation so it is difficult for us to help you.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Please Log in to join the conversation.
- camino
- Topic Author
- Offline
- New Member
Less
More
- Posts: 4
- Thank you received: 0
4 months 2 weeks ago #253242
by camino
Replied by camino on topic Deselect Radio Button In Array
Sorry, here is the version:
LimeSurvey version: LimeSurvey Cloud Version 6.3.9
Own server or LimeSurvey hosting: Limesurvey Hosting
Survey theme/template: vanilla
LimeSurvey version: LimeSurvey Cloud Version 6.3.9
Own server or LimeSurvey hosting: Limesurvey Hosting
Survey theme/template: vanilla
Please Log in to join the conversation.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10109
- Thank you received: 3595
4 months 2 weeks ago - 4 months 2 weeks ago #253248
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Deselect Radio Button In Array
This script, placed in the source of an array question will allow deselecting the radio inputs.
Sample survey attached:
Code:
<script type="text/javascript" data-author="Tony Partner"> $(document).on('ready pjax:scriptcomplete',function(){ // Identify this question var thisQuestion = $('#question{QID}'); // A function to toggle radio inputs function toggleRadio(thisCell) { if($(':radio:checked', thisCell).length == 0) { $(':radio', thisCell).trigger('click'); } else { $(':radio:eq(0)', thisCell).prop('checked', false); checkconditions('', $(':radio:eq(0)', thisCell).attr('name'), 'radio'); } } // Listener on the radio inputs $(':radio', thisQuestion).on('click', function(e) { e.stopPropagation(); }); // Listener on the array cells $('.answer-item', thisQuestion).on('click', function(e) { e.stopPropagation(); toggleRadio(this); }); // Listener on the labels $('.answer-item label', thisQuestion).on('click', function(e) { e.preventDefault(); e.stopPropagation(); toggleRadio($(this).closest('.answer-item')); }); }); </script>
Sample survey attached:
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 4 months 2 weeks ago by tpartner.
The following user(s) said Thank You: camino
Please Log in to join the conversation.
- camino
- Topic Author
- Offline
- New Member
Less
More
- Posts: 4
- Thank you received: 0
4 months 2 weeks ago #253252
by camino
Replied by camino on topic Deselect Radio Button In Array
Thank you, that works perfectly.
Please Log in to join the conversation.
- camino
- Topic Author
- Offline
- New Member
Less
More
- Posts: 4
- Thank you received: 0
4 months 1 week ago #253425
by camino
Replied by camino on topic Deselect Radio Button In Array
Another question regarding this: what do I need to modify this code to make work for single item questions with radio buttons (so not in an array)? And there is there any documentation/manual where I can learn to do this on my own? I have rudimentary coding knowledge, but I have often no idea on how to reference specific elements in LimeSurvey.
Best,
Camino
Best,
Camino
Please Log in to join the conversation.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10109
- Thank you received: 3595
4 months 1 week ago - 4 months 1 week ago #253455
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Deselect Radio Button In Array
This will work in a list-radio question:
Code:
<script type="text/javascript" data-author="Tony Partner"> $(document).on('ready pjax:scriptcomplete',function(){ // Identify this question var thisQuestion = $('#question{QID}'); // Listener on the radio inputs $(':radio', thisQuestion).css('left', '-9999em').on('click', function(e) { e.stopPropagation(); }); // Listener on the labels $('.answer-item label', thisQuestion).on('click', function(e) { e.preventDefault(); var thisItem = $(this).closest('.answer-item'); if($(':radio:checked', thisItem).length == 0) { $(':radio', thisItem).trigger('click'); } else { $(':radio:eq(0)', thisItem).prop('checked', false); checkconditions('', $(':radio:eq(0)', thisItem).attr('name'), 'radio'); } }); }); </script>
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 4 months 1 week ago by tpartner.
The following user(s) said Thank You: camino
Please Log in to join the conversation.