I have a survey where I’ve customised the multiple choice function and text entry features to create an accordian type survey. The issue was when a user expands an accordian item, enters some text and then collapses it again it means the answer can’t be submitted, as you get an “You have added text into an unselected answer choice” error.
To get around this, I used a bit of jQuery to recognise when a textarea has content and then assign a class active to the Label Wrapper.
jQuery('.LabelWrapper textarea').keyup(function(){
if(jQuery(this).val()){
jQuery(this).parent().find('label').addClass("active");
}else{
jQuery(this).parent().find('label').removeClass("active");
}
});
Then I can change the icon to a tick and make the answer uncollapsible using CSS.
At this point I thought I’d cracked it, but I’m using blocks in this survey and a Table of Contents (it’s what the client has specified). If a user goes back to this block having made entries to this page then the active class is removed and the script doesn’t run again, rendering my efforts useless. What I’d like to happen ideally is either the class on the LabelWrapper is retained when you return to the block, or the script runs again. Please can anybody help? Hope I’ve explained this OK, test survey link is below. The block in question is block 2.
https://stantec.ca1.qualtrics.com/jfe/form/SV_easbRxLBLZKGQXI
