Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Keyboard selection behavior and bugfixes. #11

Open
wants to merge 23 commits into
base: master
Choose a base branch
from

Conversation

cstickel
Copy link

@cstickel cstickel commented Feb 8, 2012

Change event should not be fired on init or if value hasn't changed. Additionally the change event should only be fired at the end of a change (when dropdown gets closed). This behavior differed from normal select boxes.
Selection by keyboard had a lot of bugs and didn't behave like native browser checkboxes.
New behavior is:

  • Open dropdown with "Return" and "Space" key. (Was "Space", "Up" and "Down".)
  • Change value to selected option in dropdown with "Return", "Space", "Tab" and "ESC". (Was buggy => it didn't work at all.)
  • "Up" and "Down" with closed dropdown directly change value to next/prev item. (Opened dropdown.)
  • "Up" and "Down" with opened dropdown select next/prev item in dropdown. Dropdown doesn't close, select value changes, change event doesn't fire. (Fixed change event behavior.)
  • "Left" and "Right" keys are used as aliases for "Up" and "Down" (New feature.)
  • Alphanumeric keys with opened dropdown search for matchString and select the first matching item. Dropdown doesn't close, select value changes, change event doesn't fire. (Closed the dropdown. Fixed change event behavior.)
  • "Page Up" and "Page Down" key behavior added. Dropdown doesn't close, select value changes, change event doesn't fire. (New feature.)
  • Alphanumeric keys with closed dropdown search for matchString and directly change value to the first match. (Was the same. But bugged with appendTo Setting. => Just bugfixed.)
  • Multiple times the same alphanumeric key, starting with an empty matchString, cycle through the items starting with the matching char. (Stuck at the first item starting with the character.)
  • All non alphanumeric keys reset matchString. (Didn't reset matchString.)
  • Added support for dropdowns with vertical scrollbar.

See commit messages for complete list of bugfixes.

Tested with latest Chrome and Firefox.

Christoph Stickel and others added 17 commits February 8, 2012 18:06
* changed keyboard selection to behave more like native select boxes
* dropdownSelection doesn't throw an error anymore, if you click on the ul but not on the a element (for example if the ul has padding and someone clicks on the free space)
…down and without triggering change event

* up, down keys and search while dropdown is open doesn't trigger change event but update input value and keep dropdown open (just like native selectboxes)
* hideDropdown should now work as expected
* improved readability
* fixed missing preventDefault, for up,down,right,left keys, if there is no next or prev element
…objects (improved performance and correct behavior for selects with 2 options with the same value)

* removed selectboxCounter
* performance improvements
* cleaned source
* event delegation for all events (cleaner source + better performance)
* bugfix for scroll position recovery
* updated tests to match fixed behavior
…election won't work after scrolling)

* more responsive fade animations (stop them that they can't stack if an dropdown gets closed and reopened very fast multiple times)
* close dropdown for all mousebuttons for clicks outside the dropdown
@cstickel
Copy link
Author

sorry for this huge pull request, i'll add some comments to the diff to make it more simple to understand.
i tried to copy native select box behavior as good as possible.
known differences are:

  • if you click on a select, while the dropdown of another select is open, the new dropdown opens and the clicked select gets focus. native selects just close the opened dropdown and keep focus on the old select. (unsure whats the best way to fix that, so far)
  • all other events than "change" on the replaced select don't fire at all. (todo: check which events make sense and trigger them)

as soon as the pull request is merged i'll add this two points to the issue tracker.

@@ -1,130 +1,192 @@
(function($) {
var selectboxCounter = 0;
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

there is no reason to keep selectboxCounter, since data-id isn't in use anymore

return false;
}
});
if(hideAfter) $current.parent().hide();
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If dropdown was hidden, hide it again. Else keep it open.

}

var fixDropdownPositions = function(element) {
if (settings.appendTo) {
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nothing to do if appendTo isn't used.

* improved performance for fixDropdownPositions (important if polling setting is used)
… dropdown has a scrollbar)

* updated jQuery version
* added compatibility for current jQuery version (dropped compatibility for pre 1.6 jQuery)
… select items, while sb-input isn't in the visible area (scrolling with long dropdowns) in webkit browsers)
…k the first time after scrolling in the dropdown
@kenliu
Copy link

kenliu commented Feb 13, 2013

any progress on this? There seems to be some good stuff here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants