Need help modifying a Matrix Javascript to work with a Side-by-Side item

uhrxx005

I have a current Javascript I use to add additional rows to a matrix table, or rather display hidden rows one at a time as a button is clicked. Can someone please help me modify this to work on a Side by Side question.

Thanks in advance!

Qualtrics.SurveyEngine.addOnload(function()
{
var that=this.questionId;
jQuery("#"+this.questionId+" tr.Choice:not(:lt(3))").hide();
jQuery("<input type='button' id='add' value='+' name='+' />").insertAfter("#"+this.questionId+" tr.ChoiceRow:last");
jQuery("#add").on('click',function(){
        var c= jQuery("tr.Choice:visible").length;
        jQuery("#"+that+" tr.Choice:eq("+c+")").show(); 
    });
 
});
 
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
 
});
 
Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/
 
});

ahmedA

The following code should work on all types of questions:

Qualtrics.SurveyEngine.addOnReady(function () {
    show_row = 3;
    choice_rows = this.getChoiceContainer().querySelectorAll("[class*='Choice']");
    choice_rows[choice_rows.length - 1].insertAdjacentHTML(
        "afterend",
        "<input type='button' id='row_adder' value='+' name='+' />"
    );
    for (i = show_row; i < choice_rows.length; i++) {
        choice_rows[i].hide();
    }
    add_row = this.getChoiceContainer().querySelector("#row_adder");
    add_row.onclick = new_row;

    function new_row() {
        if (show_row < choice_rows.length) {
            choice_rows[show_row].show();
            show_row++;
        }
        else{
            alert("You've reached the maximum number of permissible rows");
        }
    }
});

uhrxx005

@ahmedA this solution is terrific. Thank you! One more question. Is there a way for this to work with multiple questions using the Javascript on the same page?

ahmedA

Change all the variable names and the ids.

uhrxx005

Pardon my ignorance, but where do I place the Question ID?

ahmedA

by id I meant where it says id='row_adder'

Make that id and all the other variables unique for each question on the same page.