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
  • 262 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

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 ●
    • 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

    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