Hide the next button in Slider questions with Multiple statements:

Hi @dwaughtal The below code will show the next button only when all the 7 sliders have been interacted.

Qualtrics.SurveyEngine.addOnload(function() {
    var that = this;
    var q = jQuery("#" + this.questionId);
    var slidersInteracted = 0;

    this.hideNextButton();

    q.find(".track").on("mousedown touchstart", function() {
        slidersInteracted++;
    });

    q.find(".track").on("mouseup touchend", function() {
        checkSlidersInteracted();
    });

    function checkSlidersInteracted() {
        setTimeout(function() {
            if (slidersInteracted === 7) {
                that.showNextButton();
            }
        }, 100); // Adding a small delay to ensure proper event handling
    }

    // If the user goes back, reset the counter
    jQuery(window).on('beforeunload', function() {
        slidersInteracted = 0;
    });
});

Hi omkarkewat, thanks so much for this code! This worked to a large extent. The ‘next’ button does appear after 7 clicks have been made. The only possible issue with the code seems to be that if a participant goes back to move a slider they’ve already interacted with, then any change counts as an additional click. I did this unintentionally in the ‘preview’ mode by clicking twice on a slider I had already clicked, so the ‘next’ button appeared when the tally of clicks was 7, but one slider still needed to be interacted with.

Participants may change their minds and move a slider more than once - and I was hoping to keep it that way, if possible. Participants won’t be able to go back to previous pages to change their ratings, however.

I really appreciate your help!! 

Deb

Hi @dwaughtal Below code should work.

Qualtrics.SurveyEngine.addOnload(function() {
    var that = this;
    var q = jQuery("#" + this.questionId);
    var slidersInteracted = 0;
    var interactedSliders = [];

    this.hideNextButton();

    q.find(".track").on("mousedown touchstart", function() {
        var sliderId = jQuery(this).attr('id');
        if (interactedSliders.indexOf(sliderId) === -1) {
            slidersInteracted++;
            interactedSliders.push(sliderId);
            checkSlidersInteracted();
        }
    });

    function checkSlidersInteracted() {
        if (slidersInteracted === 7) {
            that.showNextButton();
        }
    }

    // If the user goes back, reset the counter
    jQuery(window).on('beforeunload', function() {
        slidersInteracted = 0;
        interactedSliders = [];
    });
});