tagcompletion like stackoverflow

Question

Working example

Bug

• add an item that exists in the list
• add an item that doesn't exist in the list
• add an item that exists in the list by clicking arrow key or clicking an item with mouse
• notice that all items are erased and everything starts over.

I am building this on top of a solution provided to me in another question. I've taken the code from that example and modified to my needs. however, now I am having the issue stated above.

What can I do to avoid having the list erase all items when a new item is added by clicking down arrow key after a non existent item is added.

Answer 1

Add the following to the options object you pass the autocomplete widget:

focus: function() { return false; }

From the docs on focus:

Canceling this event prevents the value from being updated, but does not prevent the menu item from being focused.

Here's your example without the bug: http://jsbin.com/oquda3/4