JQuery auto-complete function when a button is pressed outside

Question

I would like to know if there is a way in JQuery Autocomplete when the options open, if I press "OUTSIDE" to select or click ESCAPE on the keyboard. It closes without having to choose one option.

Does anyone know the right way to do this? Still thinking, using something to check if the focus is autocomplete, if not close it, but just IDEA.

thanks

Answer 1

Close autocomplete when the dialog is closed:

$("#dialog").dialog({ close: function() { $('#tags').autocomplete('close'); } }); 

See this in action: http://jsfiddle.net/william/3Yz9f/1/ .

---

Update

It depends on what you mean by being "general." JavaScript is very event driven. So, initially you want autocomplete to close when the dialog is closed, therefore, the first part of the answer. Of course, you can bind it to some indirect events, such as auto-fill blur or hide (you may need to make a special event to hide), but this gives you a little risk that they may not be triggered, since they are indirect.

Now you want it to close when you drag the dialog; well, it’s also not difficult; you can achieve this with the dragStart event for a dialog, but these are two different events, both in dialogs and not in autocomplete. I do not see any indirect event in the autocomplete widget itself when dragging a dialog.

If your problem relates to an autocomplete widget by id, you can use a context-based selector, for example. use $('.ui-autocomplete-input', this) instead of $('#tags') in dialog event handlers.

Answer 2

I ran into the same problem. There is only one small thing you have to do. After calling up the search metadata, set the focus. Esc and clicking outside the field close the dropdown menu.

I use a subclass of the category ( http://jqueryui.com/demos/autocomplete/#categories ) so my code looks like

  $( "#search" ).catcomplete('search'); $( "#search" ).focus(); 

I expect it to work the same with .autocomplete widgets.