Usability issues across all widgets with popup menus

[spekaryMember]

On the current demo page, I see the following problems. I am considering implementing jqwidgets in a php framework, but would like to know whether these will change. I know that some of what I am asking is difficult. JQuery UI shows some of the same problems.

1) Tabbing out of a combobox or input with the menu shown does not hide the menu. You can see this problem on the intro combobox demo on your website. If you create a page with 2 comboxes side by side, you then get both comboboxes with menus showing, and can be quite confusing for the user. The blur event appears to not want to bring the menu down if its open. I think the right response would be to queue an event to bring the menu down, rather than bringing it down immediately. The possibilities of what is going on around a blur event can be quite a bit to manage. I haven’t tested, but it also makes me worried about the response after a submit. If the blur doesn’t cause an item to get selected, then if the user types a little, sees the menu with the desired item highlighted, and then clicks a submit button somewhere else on the page, will the combobox correctly send a ‘changed’ event ahead of the submit?

2) If the user types quickly, and then tabs out, it is possible to leave the input or combobox in a state where the text is in the input field, but nothing is selected, even if autoComplete is on. I think this might depend on an async data source, but not sure. The problem here is that as a user gets comfortable with a form, they will want to move faster. The autocomplete idea is supposed to help with that — the user can type a little, and the computer does the rest. Users will learn that typing ‘Rio’ for example will select ‘Rio de Jeneiro’, and will want to quickly type ‘Rio’ and tab out to the next field. However, currently, if the user tabs out of a field before the menu pops up, the autocomplete doesn’t happen. I would like to see a _search complete, rather than have it canceled, even if the user has moved on to another field.

I know this is a tricky issue, because its hard to tell what the user wants. Perhaps the user changed his mind, and tabbed out of a field to avoid selecting anything? Users learn over time how to interact with widgets, and I think most of the time the user will want to have a default selection if they went to the trouble of typing something. I know another difficulty is dealing with an async return of an ajax call, and discovering that the input no longer has focus, but still figuring out how to process the result and put something in the field even while the user might be typing in a different field.

Any hope on changing these things?

[Peter StoevKeymaster]

Hi spekary,

1. I agree that the popup should be closed when the ComboBox widget is not on focus and I will create a work item about it. That “Tabbing out” issue is valid only for auto closing of the ComboBox and DateTimeInput popups.
2. If the typed text is not in the list, the widget will not select anything. For example, open: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxcombobox/settings.htm?classic. Type “q” in the ComboBox’s field. The result is: no selected item, because there is no item in the list that starts with “q”.. Now, delete “q” and type “c”. The result is “Café Bombón” is selected.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[spekaryMember]

For #2, go to the demo you specify and do either of these two things:
1) type c , and then tab, very quickly
2) hover over one of the checkboxes. Now type c and click the checkbox very quickly.

In both cases, you will be left with a “c” in the field and nothing selected.

I do have to say that when I try the remote demo, if I type one letter, I see the same problem, but when I type two letters, a selection appears, no matter how fast I type and tab out. And the data appears quickly. That is very impressive.

[Peter StoevKeymaster]

Hi spekary,

– I am not sure whether you tried this with version 2.8, but the Popup is closed after pressing the “tab” key.
– The “remote search” demo’s description is: “In this example is demonstrated the auto-complete feature of jqxComboBox. Suggestions are displayed when at least two characters are entered into the field.”.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[spekaryMember]

Tried it on your website. Excellent work. Also, I missed the 2 character thing. Sorry about that. Thanks for your help.

[spekaryMember]

I wanted to follow up on this post. Now that I understand a little more about how your search mechanism works, I wanted to point out situations where drop-down menus can get into a strange state if you type quickly and tab out.

Here are details to recreate the problem on different demos on your website:

Combobox:Settings
Type ‘Am’ + tab very quickly.
Result: Depending on your speed, you will either see “Americano” with the listbox closed, or “Americano” with the listbox still open, or just “Am” with the listbox open.
Expected: “Americano” with listbox closed.

Combobox:Remote Search
Type ‘be’ then press tab.
Result: If you type the tab quickly, the listbox will open and stay showing.
Expected: Regardless of the speed of typing, the listbox should either not open, or open and then close

InputBox:Default Functionality
Type “b” + tab.
Result: Depending on your speed, you will either see “Bahamas” with the listbox closed, or “b” with the listbox still open, or “b” with the listbox closed.
Expected: “Bahamas” with listbox closed.

Also, a “small” request. If the user presses tab in a jqxInputBox, I would like the tab to go to the next field as normal AND have it select the highlighted item in the listbox. Currently, you have to press tab twice, once to select, and again to go to next field.

[Peter StoevKeymaster]

Hi spekary,

We will investigate the reported issues. In case, we reproduce them, we will add work items in our bug tracking system.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts