How can I show a text box only when a certain condition is met? | XM Community
Skip to main content
Question

How can I show a text box only when a certain condition is met?

  • March 27, 2020
  • 7 replies
  • 1291 views
M
Forum|alt.badge.img+1
I would like for a "specify" text box to only appear if the applicable response is selected. I have a matrix item with 7 statements to which we are requesting a YES or NO response to whether the statement is true or not. The final statement is about whether there was some other situation not specifically mentioned before that was true, for which I allowed a text entry box. I managed to hide the entry box when you first get to that page with the following javascript: jQuery("#"+this.questionId+" .TextEntryBox").hide() Can anyone help with the syntax for making the text box appear again when YES is selected for the last statement? Thanks in advance!
Abhishek_U

7 replies

rondev
Level 6 ●●●●●●
Forum|alt.badge.img+22
  • rondev
  • Level 6 ●●●●●●
  • March 27, 2020
Inspect and get the id of the 'yes' and 'no' radio button of last statement. Add an on click event on 'Yes' button id and use this -` jQuery(" .InputText").show()` Similarly for 'No' use this - ` jQuery(".InputText").hide()`
Ron Dev (DM for any request. XM Technology Consultant, surveysolution.in)
M
Forum|alt.badge.img+1
  • marean
  • Author
  • March 27, 2020
Thanks! However, I am not adept with JavaScript at all. I just found an example line of code that I could figure out how to modify to hide the text box. Unfortunately, I have no idea how to add on OnClick event or how to make the show command conditional on the fact that the YES radio is selected. I've dug around a bit, but had no luck in finding an adaptable example. I believe the ID for my YES button is #QR~QID211~7~1. Can you provide me with a code snippet that would show me how to implement a conditional OnClick event?
rondev
Level 6 ●●●●●●
Forum|alt.badge.img+22
  • rondev
  • Level 6 ●●●●●●
  • March 28, 2020
Paste the below code in the matrix question JS onReady (assuming you have only matrix and open ended question on that page) var qid = jQuery(".QuestionOuter:not(#"+this.questionId+")").attr("id") jQuery("#"+qid).hide(); jQuery("[id='QR~QID211~7~1']").on('click',function(){ jQuery("#"+qid).show(); }); jQuery("[id='QR~QID211~7~2']").on('click',function(){ jQuery("#"+qid).hide(); });
Ron Dev (DM for any request. XM Technology Consultant, surveysolution.in)
M
Forum|alt.badge.img+1
  • marean
  • Author
  • March 31, 2020
Thank you very much for your help! I can't get this code to work for me though. I do have only the one matrix question with text entry allowed for just the last statement on that page. I'm relatively certain that I have the correct ID for that element (the positive radio button for that last row of the matrix) and so I can't figure out what the problem might be. Do you suppose that a different approach might be better? The ultimate goal is to make sure that the survey user doesn't add anything in the Specify box if they have selected No (indicating that the statement doesn't apply to them.) Maybe just have the text box appear to start with and then have it be hidden only if No is selected? Would that be simpler code that would be more likely to function correctly? Or perhaps it has to do with the fact that it's all in the same question and Qualtrics doesn't really evaluate/record responses until you proceed to the next page? It seems like it may require some "in page" code, like when you add display logic and have the option to make the new question show up immediately on the same page as the trigger question? Any insight or suggestion you could provide would be greatly appreciated!
TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • March 31, 2020
> @marean said: > Any insight or suggestion you could provide would be greatly appreciated! I always avoid "Other allow text" in Matrix questions. It is awkward from a usability perspective, difficult for the respondent to understand, and difficult to validate. In your case, you could remove the allow text from the Other row and add a text entry question, after the matrix and on the same page, that uses in-page display logic. Then display if Other is Yes in the Matrix. You can force response on both the matrix and the text entry questions. You'll see an ominous red warning saying "In Page Display Logic may behave unexpectedly with Validation Options" but in my experience it works just fine.
rondev
M
Forum|alt.badge.img+1
  • marean
  • Author
  • April 2, 2020

I initially considered that method as a solution, but the client would prefer that the Specify response is contained in the same question, but doesn't want anyone who responds No to be able to enter anything extraneous in the text entry box (i.e., None, NA, etc.)
I've found some Javascript code that works to clear the text box on advance (with a blur function that you provided to someone else) and some to make a text entry box Read Only, but I haven't been able to figure out how to apply that only if the No response has been selected. If Yes (or neither response) is selected, any entry should be allowed/retained.
It seems like those solutions would be better, since the show/hide stuff didn't appear to be triggered correctly in the code rondev suggested, but I have to be able to get them into some sort of conditional statement so those actions are not carried out universally on the page, which is all I've been able to do so far.
Any ideas/tips?? Thanks!


D
Forum|alt.badge.img
  • darwincam
  • November 16, 2020

I have a question that's a multiple choice question with an "other" option with text entry. I too would like to hide the text box until the user selects "other". I tried the code above and it did not work (text box shown when the question was loaded)
Is there something that needs to change with a different question type than matrix from the OP?
TIA

Terms & ConditionsAccessibility statement