Join GitHub today
GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together.Sign up
Clicking item in Prompt with Arrow closes drop down without adding item to input #5
Steps to Reproduce
Note: If you focus on the input with the mouse, then use the down arrow key to open the drop down menu, and then use the mouse to select an item via click it works as expected
Here is an image that is more to the point of the problem... You have to click in the area highlighted with red for it to work as expected. So if you click anywhere outside of that red box it will not work, including on the actual text/name of the tag
I think part of the issue is that there is a race condition between the blur event on the input and the click event on the selected row.
There appears to be some consideration for this issue already in textext.plugin.autocomplete.js at line 385-388. If I simply change the timeout to something like 200 ms, things worked for me. However I was not happy with that as a solution.
When the input loses focus from the mousedown event on the row, the blur event handler is closing the autocomplete dropdown before the value is set (since the value will not be set once the dropdown is hidden).
This is also causing the similar issue where in Chrome when using the dropdown scroll bar, the dropdown will close (because in Chrome focus of form fields are lost when clicking scroll buttons).
I was attempting a fix where in the mousedown of the autocomplete I set a data attribute on the container, which could then be used by the blur event to determine if the blur was triggered by a mousedown event from the autocomplete (in which case it would either ignore triggering the close dropdown event or put back the focus in the form input).
I was running into some edge cases with this solution, where if you mousedown inside the dropdown then dragged outside of it and mouseup, then the dropdown could get into a state where it was stuck open (until you chose an item). I was looking into a solution that also put a click handler on the body that would check to see if the coordinates of the event was triggered within the dropdown, if not then close the dropdown. This edge case is caused by this Chrome bug: http://code.google.com/p/chromium/issues/detail?id=31264