Update same page question text with Javascript

Question

Hi - 
I have a block with a multiple choice question, a file upload question, and then a yes/no "are you finished?" question. The block is looped until the respondent is finished or they reach 50 iterations. How I would like it to work:
- user chooses a value in the multiple choice question (say the choices are cat, dog, bird)
- on choosing a value, the file upload question appears below, and the text of the question updates based on the choice selected, e.g. if "bird" is chosen, the first question says "upload a photo of the bird"

The problem: I can make the file upload question show when the user selects a value, and I can capture the value they select, but I cannot figure out how to change the text of the file upload question. I can't use piping, since all these need to be on the same page to make use of the loop. I could make pre-filled file upload questions for each option in the multiple choice, and show/hide the appropriate one, but it seems like I should be able to just change the file upload question text with javascript. Can I?

TomG · Accepted Answer

Add a `<span>` with an id in your second question, then change the innerHTML of it based on the choice the user clicks in the first question.

Jerrad · Answer

Thanks, Tom - I figured it would be something easy. For others who might be even more new to this than me, here is some more detail:- In the file upload question editor, click HTML view and add something like this where you want to be able to insert text: - ``- Then, in the Javascript for the first multiple choice question, add something like:`var choiceValue = element.innerText; //get the selection``jQuery('#1_QID3').show(); //show the file upload question``document.getElementById("upload1").innerHTML = choiceValue //set the question text`

Sign up

Login to the Community

Scanning file for viruses.

This file cannot be downloaded