Disable Hidden Boxes with Javascript | XM Community
Skip to main content
Hello I am using the syntax below to hide boxes in a matrix table, however they can still be selected while hidden. How do I disable them as well? $('QR~QIDx~1~2').up('td').childElements().invoke('hide'); I've tried replacing the word "hide" with "disable", but that doesn't work for multiple cells. Thanks,
@TriciaB Does adding `.prop("disabled",true)` to your JS help? So it should look something like this: ``` $('QR~QIDx~1~2').up('td').childElements().prop("disabled",true).invoke('hide'); ``` That should hide and disable the elements you designate. A less elegant way with a bit more code would be to write the "hide" and "disable" for each appropriate cell in your matrix. ```var cell = "1~2"; jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").prop("disabled",true).hide(); ```
Thanks @C_Bohn, but that doesn't seem to work. It just crashes and doesn't even hide the cell.
@TriciaB . I wonder if we approach it from a different angle if it would help. For example, let's say I have a 3x3 matrix: ! Let's say that I also want to hide and disable the following cells: row 1 column 1, row 2 column 2, row 3 column 2, and row 3 column 3. In the JavaScript, I would build out the following under ".addOnLoad". <code> Qualtrics.SurveyEngine.addOnload(function() { var cell = "1~1"; jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").prop("disabled",true).hide(); var cell = "2~2"; jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").prop("disabled",true).hide(); var cell = "3~2"; jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").prop("disabled",true).hide(); var cell = "3~3"; jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").prop("disabled",true).hide(); }); </code> What results in the survey view is a cell that is hidden and disabled. !
None of these worked for me. I could hide options, but if I tried to disable them, they wouldn't even hide anymore. My solution was to hide the options, then add custom validation that didn't allow choosing a hidden option, with the message "Please choose a valid option".