How can I disable a dropdown list in a second column if N/A is selected in column 1? | Experience Community
Skip to main content
Solved

How can I disable a dropdown list in a second column if N/A is selected in column 1?

  • June 23, 2020
  • 9 replies
  • 221 views
R

I have two columns in a side-by-side question. Column 1 has options 1-4, the 4th of which is 'N/A'. Is there a simple way I could disable the second column if 'N/A' is selected in column 1?
Right now I have
jQuery("#"+this.questionId+" input[type='radio']").on('click',function(){
         if(jQuery(this).val()==4){
jQuery("[id='QR~QID106#2~1']").prop("disabled", true);
       jQuery("[id='QR~QID106#2~2']").prop("disabled", true);
       jQuery("[id='QR~QID106#2~3']").prop("disabled", true);
    }
   });
but because I have three rows, the above disables the second column entirely if option 4 is selected for ANY of the three rows. How can I edit this so it only disables the row where N/A is selected in the first column?

Best answer by TomG

Don't use ids. Find the second column element relative to the first. For example, if the second column is a text input:
var col1 = jQuery(this);
if(col1.val()==4) col1.closest("tr").find(".InputText").prop("disabled",true);

    9 replies

    TomG
    Level 8 ●●●●●●●●
    Forum|alt.badge.img+27
    • TomG
    • Level 8 ●●●●●●●●
    • Answer
    • June 23, 2020

    Don't use ids. Find the second column element relative to the first. For example, if the second column is a text input:
    var col1 = jQuery(this);
    if(col1.val()==4) col1.closest("tr").find(".InputText").prop("disabled",true);

      R
      • rrauser
      • Author
      • June 23, 2020

      TomG thanks for the tip, I will try that. What if it's a dropdown list in the second column instead of a text input?

      TomG
      Level 8 ●●●●●●●●
      Forum|alt.badge.img+27
      • TomG
      • Level 8 ●●●●●●●●
      • June 23, 2020

      https://www.qualtrics.com/community/discussion/comment/27039#Comment_27039Change find(".InputText") to find("select").

        R
        • rrauser
        • Author
        • June 23, 2020

        TomG Ok thanks! I got it working somewhat:
        jQuery("#"+this.questionId+" input[type='radio']").on('click',function(){
          var col1 = jQuery(this);
          if(col1.val()==4) col1.closest("tr").find("select").prop("disabled",true);
         });
        but my issue now is that if I click on N/A and change to one of the other three options, the dropdown list stays disabled. Is there a way I can tweak this further so the dropdown is re-enabled if the selected option is changed?

        TomG
        Level 8 ●●●●●●●●
        Forum|alt.badge.img+27
        • TomG
        • Level 8 ●●●●●●●●
        • June 23, 2020

        Add an else to your if to reenable it.

        R
        • rrauser
        • Author
        • June 23, 2020

        TomG Thank you so much! Think it's working well now:
         jQuery("#"+this.questionId+" input[type='radio']").on('click',function(){
          var col1 = jQuery(this);
          if(col1.val()==4) col1.closest("tr").find("select").prop("disabled",true);
           else{
               col1.closest("tr ").find("select").prop("disabled",false);
           }
         });

        D
        Forum|alt.badge.img
        • DLA
        • December 11, 2022

        How do I find the "questionID"?

        TomG
        Level 8 ●●●●●●●●
        Forum|alt.badge.img+27
        • TomG
        • Level 8 ●●●●●●●●
        • December 11, 2022

        https://community.qualtrics.com/XMcommunity/discussion/comment/53057#Comment_53057You don't need to. 

        this.questionId
        IS the question id.

        MatthewM
        Level 6 ●●●●●●
        Forum|alt.badge.img+30
        • MatthewM
        • Level 6 ●●●●●●
        • June 27, 2023

        https://www.qualtrics.com/community/discussion/comment/27039#Comment_27039Change find(".InputText") to find("select").

        Thank you for sharing this; it works wonders! If I wanted to apply this code to a question where the second column is a radio button (Yes/No), what would I use in place of find("select")?

        Terms & ConditionsAccessibility statement