Hi LauraCeleste ,
You can achieve the above using below JS code inside the JS API of side-by-side matrix with n'th number of rows(just update the parseInt value as per your QID)(I am assuming there is only side-by-side matrix on that page)
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/




});


Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/

// Get the value of 'num' from the survey question and parse it as an integer
var num = parseInt("${q://QID4/ChoiceTextEntryValue}", 10);


// Get all table rows with class "Choice"
let tr = document.querySelectorAll("tr.Choice");


// Hide all rows in the table
for (let i = 0; i < tr.length; i++) {
    trti].style.display = "none";
}


// Display the first 'num' rows based on the value of 'num'
for (let i = 0; i < num; i++) {
    // If 'num' is greater than or equal to the total number of rows, display all rows
    if (num >= tr.length && i < tr.length) {
        tr�i].style.display = "table-row";
    }
    // If 'num' is less than the total number of rows, display only the first 'num' rows
    else if (num < tr.length && i < num) {
        tr i].style.display = "table-row";
    }
}


});


Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/


});
Hope it resolves your query!!!

Thanks for the code! Unfortunately, it looks like this only displays the headers (Age/Gender and the groupings) but does not show any of the option responses, even when I try a different range of numbers for the previous question (QID4). There are no other matrices on this page. Any suggestions?
Would skip logic in my other questions cause any issues?

Are QID4 and QID7 on the same page?

Yes they are. And that's the main aim, to keep it all on the same page (without page breaks).

I also have a similar question when it comes to a drill-down question, that I'd like to display the number of response rows to match a previous question (previous question is # of languages known, then the drill down would show one row for each number they selected, so they can specify the language from the drop down menu). So if at all possible I was hoping to learn from this code and adapt it for that type of question too. Thanks for your help!

Hi LauraCeleste
Can you see above gif and confirm above is the requirement .
IF yes ,Can you share further details of your question structure .
If possible make dummy copy and share the preview link .

Hi qualtrics_nerd , in the above gif the issue is that you click the arrow to go to the next page. I am trying to avoid that (as that's something I could do with display logic). The aim is to keep all questions on the same page, so that question 2 loads directly below question 1 (without the need to click next).

Hi LauraCeleste ,
Got it my previous code was made considering that both question were on different page.
please use below updated code for questions on same page:
altrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/




});


Qualtrics.SurveyEngine.addOnReady(function()
{

// Get all table rows with class "Choice"
let tr = document.querySelectorAll("tr.Choice");
// Hide all rows in the table
for (let i = 0; i < tr.length; i++) {
    trti].style.display = "none";
}



// Get the value of 'num' from the survey question and parse it as an integer
let numval=document.querySelector("input");


numval.addEventListener("keyup",function() {
 let num=parseInt(numval.value,10);

// Display the first 'num' rows based on the value of 'num'
for (let i = 0; i < num; i++) {
    // If 'num' is greater than or equal to the total number of rows, display all rows
    if (num >= tr.length && i < tr.length) {
        tr�i].style.display = "table-row";
    }
    // If 'num' is less than the total number of rows, display only the first 'num' rows
    else if (num < tr.length && i < num) {
        tr)i].style.display = "table-row";
    }
}
for (let i = num; i < tr.length; i++) {
    trei].style.display = "none";
}


});

});


Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/


});

Thanks. Unfortunately, it looks like I get the same issue I first mentioned, that this only displays the headers (Age/Gender and the groupings) but does not show any of the option responses, even when I try a different range of numbers for the previous question (QID4). It's all on the same page though.
In your latest code, I don't see anywhere where I can indicate I'm referring to QID4 does this line need to be incorporated from your first suggestion?
// Get the value of 'num' from the survey question and parse it as an integer
var num = parseInt("${q://QID4/ChoiceTextEntryValue}", 10);

LauraCeleste ,
No , as it is getting the value dynamically
// Get the value of 'num' from the survey question and parse it as an integer
let numval=document.querySelector("input");

Hm, seems repetitive of this line though, no?
 let num=parseInt(numval.value,10);
Could you clarify what you meant. If it replaces some code or added as it's own line? I tried adding
var num = parseInt("${q://QID4/ChoiceTextEntryValue}", 10);
and still have the same issue.
Thanks!

Hi LauraCeleste ,
Here is preview where it is working on same page:

https://community.qualtrics.com/XMcommunity/discussion/comment/55460#Comment_55460Piping of data on the same page will not work.
As it will not be updated dynamically .
So what i have done here is:
let numval=document.querySelector("input");
//through above line i am selecting the text box where value is being entered


 let num=parseInt(numval.value,10);
//numval.value will be a string so I am parsing it the parseInt() to make it integer and storing it in num to be used later

Thanks for sharing the gif, glad it works for you. It's a shame that piping doesn't work on the same page. So I now have the issue that I have other questions on the same page that also have text response boxes, so if I can't identify the specific Question ID then maybe it's unsure which response it is referencing.
I re-tested it, and it looks like the code works, but for the wrong question (it works based on the first Text box on the page, not the question I was hoping for, but so close!). Any thoughts on how to refer just to the one question before? Thanks so much for your help!

Hi LauraCeleste ,
If you can find the id of the textbox then you can do it , below are the steps for the same;
Replace below line of code with :

let numval=document.querySelector("input");

with this line:

let numval=document.getElementById("QR~QID9")
//QR~QID9 is the id of the textbox


Every thing else remains the same

Amazing! Thank you so much! It works!

LauraCeleste ,
You are welcome!!!

qualtrics_nerd One last question
If I wanted to do the same thing, but for a drill down question this time, is there an easy way to update the code for that?
(i.e., for a drill-down question, I'd like to display the number of response rows to match a previous question (previous question is # of languages known, then the drill down would show one row for each number they selected, so they can specify the language from the drop down menu).

LauraCeleste ,
Will need more information as to what type question will be the previous one will be(format).
and format of data in drill down question(csv file)

Of course.
The previous type of question is a Text Entry (which gives Number of languages spoken, in numeric format; similar to my original question), and the format of the data for the Drill Down, is csv file

Oh, I found a solution from your initial suggestion. Now using a Text Entry (as the previous question) to inform a Matrix table (likert type answer, with drop down menu).
Qualtrics.SurveyEngine.addOnReady(function() {
// Get all table rows with tr.Choice if it's a choice
let tr = document.querySelectorAll("tr.ChoiceRow");

// Hide all rows in the table
for (let i = 0; i < tr.length; i++) {
tr[i].style.display = "none";
}
​
// Get the value of 'num' from the survey question and parse it as an integer
let numval = document.getElementById("QR~QID21");
​
numval.addEventListener("input", function() {
// Parse the value of the input as an integer
let num = parseInt(numval.value, 10);
​
// Show the first 'num' rows based on the value of 'num'
for (let i = 0; i < tr.length; i++) {
tr i].style.display = num > i ? "table-row" : "none";
}
});
});