How to display text entry box with a text on its left only when the option selected | XM Community
Skip to main content

How to display text entry box with a text on its left only when the option selected

  • March 14, 2022
  • 3 replies
  • 252 views
J
Forum|alt.badge.img+1

Hi all,
As the title stated, I'd like to display the text entry box along with the a text to the left of the TE box only when that particular response option is selected.
For example, lets say that I have a survey question as follows:
What is your preferred method of transportation?
A. Bus
B. Train/tram
C. Walking
D. Motorcycle/bicycle
E. Other
Please specify: [TEXT ENTRY BOX HERE]

I'd like the "Please specify:" text and the text entry box to only be displayed when the option E is selected. Is this possible in Qualtrics?

Thanks!
J

3 replies

Aanurag_QC
QPN Level 5 ●●●●●
Forum|alt.badge.img+31
  • Aanurag_QC
  • 256 replies
  • March 14, 2022

Use the below code in order to achieve what you're looking for


Qualtrics.SurveyEngine.addOnload(function()
{
  var QID = this.questionId;
   
   
  jQuery("#" + QID + " .InputText ").hide();
   jQuery("#" + QID + " input[type='radio']").each(function(){
     
       if(jQuery(this).prop("checked") == true)
      {
           var v1 = jQuery(this).attr("id");
        jQuery("[id*='"+v1+"~TEXT']").show();
         }
      else
      {
       var v1 = jQuery(this).attr("id");
      jQuery("[id*='"+v1+"~TEXT']").val('');
       jQuery("[id*='"+v1+"~TEXT']").hide();
     }    
   });
  
 jQuery("#" + QID + " .Selection ").on("click change",function(){
   
    jQuery("#" + QID + " input[type='radio']").each(function(){
     
       if(jQuery(this).prop("checked") == true)
      {
           var v1 = jQuery(this).attr("id");
        jQuery("[id*='"+v1+"~TEXT']").show();
         }
      else
      {
       var v1 = jQuery(this).attr("id");
      jQuery("[id*='"+v1+"~TEXT']").val('');
       jQuery("[id*='"+v1+"~TEXT']").hide();
     }    
   });
   });

 

});
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*/

});

Nogstai
QPN Level 1 ●
Forum|alt.badge.img+6
  • Nogstai
  • QPN Level 1 ●
  • 19 replies
  • September 5, 2022

https://community.qualtrics.com/XMcommunity/discussion/comment/44550#Comment_44550I tried it out, but it's not showing the text entry box. I am testing it in Preview Block
image.png

E
Level 1 ●
Forum|alt.badge.img+6
  • ebony_haley618
  • Level 1 ●
  • 21 replies
  • June 23, 2025

I’m also looking for a solution to this. I was able to hide the text entry box using this 

Qualtrics.SurveyEngine.addOnReady(function()
{
    var QID= this.questionId;
jQuery("#" + QID + " .InputText ").hide();
jQuery("#" + QID + " input[type='radio']").each(function(){

if(jQuery(this).prop("checked") == true)
{
var v1 = jQuery(this).attr("id");
jQuery("[id*='"+v1+"~TEXT']").show();
}
else
{
var v1 = jQuery(this).attr("id");
jQuery("[id*='"+v1+"~TEXT']").val('');
jQuery("[id*='"+v1+"~TEXT']").hide();
}
});


jQuery("#" + QID + " .Selection ").on("click change",function(){

jQuery("#" + QID + " input[type='radio']").each(function(){

if(jQuery(this).prop("checked") == true)
{
var v1 = jQuery(this).attr("id");
jQuery("[id*='"+v1+"~TEXT']").show();
}
else
{
var v1 = jQuery(this).attr("id");
jQuery("[id*='"+v1+"~TEXT']").val('');
jQuery("[id*='"+v1+"~TEXT']").hide();
}
});
});


});
 

But I can’t find a way to show the text “Please specify”.


Terms & ConditionsAccessibility statement