how to have select box with input field as an option in bootstrap select?

Question

I have a select combo box here. What I need is the input text box to appear when other option is selected in select box. I have been using bootstrap select tag.

  <select name="store_name" id="store_name"  class="selectpicker" data-width="100%">
    <option value="" disabled="disabled" >Please select</option>
    <option value="Option 1">Option 1</option>
    <option value="Option 2">Option 2</option>
    <option value="Other">Other</option>
  </select>

  <input type="text" id="store_name" name="store_name" value="" class="form-control" />

Could you provide a simple mockup so that we could better understand what you need here? — Khanh Tran, Mar 11 '14 at 08:26

score 0 · Answer 1 · answered Mar 11 '14 at 08:55

        $('#pasveids').on('change', function(e){
            if(e.val == 'Value if clicked on other') {
                $('#hiddenevent').attr('type', 'text');
                $('#pasveids').attr('name', '');
                $('#hiddenevent').attr('name', 'eventtype');


            } else {

                $('#hiddenevent').attr('type', 'hidden');
                $('#pasveids').attr('name', 'eventtype');
            }
        });

id=pasveids is my select box! (using select2 plugin js), but may work for other too!

id=hiddenevent is input field which is hidden at start, and when you click on dropdown, which e(event).val == it shows it, if click other, hides!

how to have select box with input field as an option in bootstrap select?

1 Answers1