Custom Code to Hide Scale Options in Side by Side Matrix | XM Community
Question

Custom Code to Hide Scale Options in Side by Side Matrix

  • 30 April 2024
  • 1 reply
  • 24 views

Userlevel 1
Badge +1

Hi, I have the side-by-side question below with both the statements and column options being based on display logic from responses previous questions that were “select all that apply” (which solutions have you used, and which options did you use the solutions with). Solutions listed in the statements (ABCD), and the options they use them with (1234) in the columns. A respondent may use solution A&B with options 1, 2, &3, but they only used solution C with the option 1. How can I hide or disable the radio buttons highlighted so that they don’t see or aren’t able to select for those?
 

 


1 reply

Userlevel 5
Badge +12

Hi @adawson the below code will disable other cells in that row when any option is selected.


Qualtrics.SurveyEngine.addOnReady(function () {
    const quest = this;
    const qc = quest.questionContainer;

    const sbs_row_toggle = function () {
        const allOptions = qc.querySelectorAll(".Choice input[type='radio']");

        allOptions.forEach((option) => {
            option.addEventListener(
                "change",
                () => {
                    const row = option.closest(".Choice");

                    if (row) {
                        const allCells = row.querySelectorAll("input[type='radio']");

                        allCells.forEach((cell) => {
                            if (cell !== option) {
                                cell.disabled = option.checked;
                            }
                        });
                    }
                },
                false
            );
        });
    };

    sbs_row_toggle(); // Disable other cells in the row when any option is selected
});

 

Leave a Reply