Background:
Radio buttons aren't very flexible when you are delivering a survey. Once any one of the elements of a default set in html is selected, you must select one of the choices. Period.
Make deselectable buttons instead:
Start with a new survey using a copy of the default template, actually these procedures will work with most of the templates in LimeSurvey.
In the LimeSurvey presentation and navigation options for the new survey, select "Yes" for show "No answer".
In the template copy modify the javascript file, template.js. Add the following script funcitons, hideNoAnswerRadio(), clickRadio() and a document.ready():
Code:
/************************************************************
* Hide any existing "no answer" options, let it be a behind
* the scenes default.
************************************************************/
function hideNoAnswerRadio(){
var radioset, hiddeninput ;
if ($('li.noanswer-item input').length>0){
// hide the the 'No answer' option
$('li.noanswer-item').css('display','none');
$('li.noanswer-item input').attr('value','N');
// for each No answer option on the page
// you could also just set the default to "No answer"
$('li.noanswer-item input').each(function(){
// find the hidden input for this radio button set
hiddeninput =$(this)
.parents('td.answer')
.find('input[type="hidden"]');
if ( $(hiddeninput).val() === "" ){ // no selection for this radio button set
// answer container, drill down to find radio button inputs
radioset = $(hiddeninput).parent('td.answer');
$(radioset) // "no answer" is the checked item
.find('input[value="N"]')
.attr('checked','true');
$(hiddeninput) // make radio set "no answer"
.attr('value','N');
}
});
}
}
/************************************************************
* If an already selected radio button is clicked, it
* becomes UNSELECTED and the hidden "No Answer" item is
* selected. To keep track of what was last selected
* the 'oldval' is stored in the hidden input element for the
* radio button set.
************************************************************/
function clickRadio (ctrl) {
// radioset hidden input element
var hiddeninput =$(ctrl)
.parents('td.answer')
.find('input[type="hidden"]');
if ( $(hiddeninput).attr('oldval') === $(ctrl).val() ) { // button selected again if it matches the oldval
var radioset = $(hiddeninput) // radio button set
.parent('td.answer');
$(radioset) // remove checked attribute to uncheck all radio buttons in set
.find('input')
.removeAttr('checked');
$(hiddeninput) // set hidden input to "no answer"
.attr('checked','true')
.attr('value','N')
.removeAttr('oldval');
} else {
$(hiddeninput)
.attr('oldval',$(ctrl).val()); // keep a copy of the item selected for next time something is clicked
}
} // clickRadio
$(document).ready(function(){
hideNoAnswerRadio();
$('input.radio').click(function(){
clickRadio(this);
});
});
Deselectable Radio Buttons on Survey
Topic Author
