yandex
loader

please wait

  • Apoorva Saxena Mar-13-2019 01:09:31 PM ( 2 months ago )

    input field with id = field0 is a hidden field but still gets value from select, but when user select "Other", input text field0 will appear.

    $(function() {
      $('#selectNo').val($('#selectNO option:selected').val());
    
      $('#selectNo').bind('change', function() {
        $('#field0').val($('#selectNo option:selected').text());
      });
    });
     src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
     id="selectNo">
       value="" selected="selected">-- Please Select --
       value="one">One
       value="two">Two
       value="three">Three
       value="other">Other
    
    
     id="field0" value="" style="display:none;"/>
  • Imran Malik Mar-13-2019 01:10:40 PM ( 2 months ago )

    You can initially hide your textbox by using css's display: none property on the id #field0. Then, within your jQuery, you can use a if statment to check whether the option with the value other has been selected, and if it has you can display the textbox using the .show() method, otherwise, if the other option is not selected you can hide it using the .hide() method.

    See example below:

    $(function() {
      $otherField = $("#field0");
      $('#selectNo').on('change', function() {
        if(this.value === 'other') {
          $otherField.show();
        } else {
          $otherField.hide();
        }
        $otherField.val(this.value);
      });
    });
    #field0 {
      display: none;
    }
     src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
     id="selectNo">
       value="" selected="selected">-- Please Select --
       value="one">One
       value="two">Two
       value="three">Three
       value="other">Other
    
    
     id="field0" value="" />

Please login

Similar Discussion

Recommended For You