0

I made a multiple selector with multiple select form element and a text input. I used jQuery toggle() method to hide and show multiple select item on click to the text input. After showing the multiple selector, visitor can select multiple item with ctrl / cmd / shift key and then i need to hide the multiple select item. I can hide by clicking again to text input.

But i want it to hide automatically when im not working with multiple select item. Im using it twice in same page and using bootstrap. Now i could not find the way to solve it.

here is the source: http://jsfiddle.net/3UE7D/3/

Please help me.

itskawsar
  • 1,232
  • 1
  • 19
  • 30
  • `toggle()` used that way is deprecated, and you should probably be using `focus` and `blur` for this anyway, like this [**FIDDLE**](http://jsfiddle.net/3UE7D/4/) ? – adeneo Mar 20 '13 at 23:05
  • i have tried with `focus` and `blur` before and with that result i can not select multiple data from multiple select item. thanks – itskawsar Mar 20 '13 at 23:29
  • Then you need to be more inventive, and do something like [**THIS**](http://jsfiddle.net/3UE7D/5/) ? – adeneo Mar 20 '13 at 23:37
  • thanks. i have thought about `setTimeout`, but user might took more time to choice multiple item. – itskawsar Mar 21 '13 at 00:08

1 Answers1

2

I reckon this would solve your problem

I updated your fiddle here

I added the following code there

$(document).click(function(){  
    $('select[name="location"]').slideUp(300);
});

$('select[name="location"]')
    .click(function(e) {
        e.stopPropagation();
    })    
    .hide();
Community
  • 1
  • 1
DanielDMO
  • 86
  • 1
  • 9