Logic display and auto advance on a matrix question | Experience Community
Skip to main content
Solved

Logic display and auto advance on a matrix question

  • Feb 1, 2021 4:50 PM UTC
  • 8 replies
  • 144 views

Hello,
I have a matrix question with 3 statements (A, B, C) and 2 scale points (yes and no). I am trying to write a code such that B will show up when A is yes, and C will show up when B is yes. If no is chosen, respondents will be auto advanced to the next question.
All suggestions, and/or examples are very much appreciated!
Thanks in advance, and have a nice day!

Best answer by ahmedA

No, it's my fault for not looking into the nitty-gritties. This should do the job for you:
Qualtrics.SurveyEngine.addOnReady(function () {
    all_rows = this.getQuestionContainer().querySelectorAll("tr");
    that = this;
    for (var i = 2; i < all_rows.length; i++) {
        all_rows[i].hide();
    }
    this.questionclick = function (ev, el) {
        var row = Number(el.id.split("~")[2]);
        var choice = Number(el.id.split("~")[3]);
        if (choice == 2 || row == all_rows.length - 1) {
            that.clickNextButton();
        } else if (choice == 1) {
            all_rows[row + 1].show();
        }
    };
});

You can remove

|| row ==all_rows.length-1
if you do not want to auto advance when a Yes on the third row is clicked.

View original

8 replies

Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Feb 1, 2021 5:50 PM UTC

Qualtrics.SurveyEngine.addOnReady(function () {


all_rows = this.getQuestionContainer().querySelectorAll("tr");
that = this;
for (var i = 2; i < all_rows.length; i++){
all_rows[i].hide();
}

this.questionclick = function () {
for (var i = 1; i < all_rows.length - 1; i++) {
var a = that.getChoiceValue(i, 1);
if (a) {
all_rows[i + 1].show();
} else {
that.setChoiceValue(i + 1, 1, false);
that.setChoiceValue(i + 1, 2, false);
all_rows[i + 1].hide();
}
}
};
});

Demo


  • Author
  • Feb 2, 2021 10:15 AM UTC

Hi ahmedA, thank you so much for your response. Your code works perfectly for the Logic Display.
For auto advance, I tried to integrate your code with my code, but it only direct to the next question when the last option (C) has been chosen. May I have the advice on how to adjust it so that the auto advance is on when a "No" is chosen?
Here is my code:
Qualtrics.SurveyEngine.addOnload(function()
{
jQuery("td").click(function(){
if(jQuery(".ChoiceRow").length == (jQuery(".q-checked").length + 1))
{
  jQuery("#NextButton").click()
}
});
});
Thank you for the massive help!


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Feb 2, 2021 10:52 AM UTC

Remove everything in the

else
block and just keep this line:
that.clickNextButton
. This will click the next button, when any "No" is selected.


  • Author
  • Feb 2, 2021 11:25 AM UTC

Thank you ahmedA for your prompt response. I tried adding that.clickNextButton to the else block but it doesn't work. So now the code I am having is:
Qualtrics.SurveyEngine.addOnReady(function () {
all_rows = this.getQuestionContainer().querySelectorAll("tr");
that = this;
for (var i = 2; i < all_rows.length; i++){
all_rows[i].hide();
}
this.questionclick = function () {
for (var i = 1; i < all_rows.length - 1; i++) {
var a = that.getChoiceValue(i, 1);
if (a) {
all_rows[i + 1].show();
} else {
that.clickNextButton
}
}
};
});


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Feb 2, 2021 11:34 AM UTC

sorry.... clickNextButton is a function. You need to add () after it.
So it should be

that.
clickNextButton()


  • Author
  • Feb 2, 2021 11:44 AM UTC

Thank you ahmedA, however, when () is added, it auto advanced whenever an option is clicked, regardless of Yes or No.
Sorry for taking too much time!


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Answer
  • Feb 2, 2021 12:12 PM UTC

No, it's my fault for not looking into the nitty-gritties. This should do the job for you:
Qualtrics.SurveyEngine.addOnReady(function () {
    all_rows = this.getQuestionContainer().querySelectorAll("tr");
    that = this;
    for (var i = 2; i < all_rows.length; i++) {
        all_rows[i].hide();
    }
    this.questionclick = function (ev, el) {
        var row = Number(el.id.split("~")[2]);
        var choice = Number(el.id.split("~")[3]);
        if (choice == 2 || row == all_rows.length - 1) {
            that.clickNextButton();
        } else if (choice == 1) {
            all_rows[row + 1].show();
        }
    };
});

You can remove

|| row ==all_rows.length-1
if you do not want to auto advance when a Yes on the third row is clicked.


  • Author
  • Feb 2, 2021 1:50 PM UTC

Thank you ahmedA! It works perfectly now. Have a great day! :-)