ComboBox drop-down does not close when tabbing out

[p2806Participant]

When pressing tab to move out of a combo box whose drop-down has been opened, the drop-down does not close, which of course it should.

I had to manually add a onkeydown handler to every jqxComboBox in our application. Check for event.keyCode === 9 and close() the dropdown myself. I would consider this a bug and look forward to having the fix included in your next release.

[StanislavParticipant]

Hello p2806,

Can you please send us an example for a more detailed testing?

I did some tests and it worked fine, it always selected the next element.

Best Regards,
Stanislav

jQWidgets Team
http://www.jqwidgets.com/

[p2806Participant]

Sorry that I do not have a simplified example available, but it may help you to know that I’m using the React version of the JQWidgets library. This bug happens on all of our combo boxes with drop-downs and freely editable text, so I feel somewhat confident that it’s not particular to our environment (except possibly the React version of your code)

Regarding your comment that “it always selected the next element,” this is not the bug. Yes, it does select the next element when pressing tab, but the drop-down does not close.

[StanislavParticipant]

Hello p2806,

Hmm strange, it still seems a bit odd that it doesn’t work on your end.
What version of react are you using, if you could give me all versions you are using in your project, so I can recreate an environment as close to yours as possible for testing.

As for a workaround, for now, I would suggest you to use some event handlers to close the drop-down.
‘blur‘, close the drop-down when you select an item

I am testing this on the latest version of jqwidgets and react.

Best Regards,
Stanislav

jQWidgets Team
http://www.jqwidgets.com/

[p2806Participant]

Ours isn’t the newest React version. We have:
“react”: “^15.5.4”
I forget where to see the JQWidgets version number, but looking inside jqxcombobox.js shows version 5.6.0. Doesn’t JQWidgets use its own code to implement its widgets, such that a problem like this would be irrespective of React version?
I used onkeydown handler to detect tab press to fix it, but blur as you suggest is probably a better solution, thanks.

[p2806Participant]

FYI, blur does not fire, so onkeydown with check for keyCode === 9 is the only solution that currently works.

[Author]

Posts