Dropdowns update - keyboard, touch and submenus

[blakeembrey]

Fixes:

• Keyboard navigation using submenus (acts similar to right-click in Mac, going up first starts to top of list, bottom the bottom - moves from there, etc. Only difference is that the submenus display on item focus)
• Takes into account the .dropup, .dropdown and .pull-left modifier classes. E.g. If it's pull-left the left and right arrows switch around, if it's a dropup submenu - we start by focusing the last item vs the first which is at the top.
• Touch navigation now works prevents the default click events from happening with the delay - looks ugly
• [esc] key will bring you back in focus with the initial button no matter where in the dropdown you are (and tapping it again reopens the dropdown, like previous behaviour)

[blakeembrey]

This should close #5054

[thezoggy]

should squash commits

[blakeembrey]

@thezoggy Just squashed all the commits. Should be a little easier to read now

[blakeembrey]

What's the opinion on trigger click events from a touchstart within the dropdown. I find it extremely ugly on iOS devices when I click a link in the dropdowns and 300ms later the click appears. Just seems sort of dysfunctional.

[zawaideh]

I am finding that I need a call to preventDefault() to get this working on Android and iOS.

$('body').on('touchstart.dropdown', '.dropdown-menu', function (e) { e.stopPropagation(); e.preventDefault(); })

[abhisec]

The dropdown inside tabs still doesn't respond to touch events:
http://twitter.github.com/bootstrap/javascript.html#tabs

if you click on the dropdown in above example on ipad, there is no event when you select @fat or @mdo

[blakeembrey]

@abhisec Thanks for the report. I will fix that up later today or tomorrow for you. Shouldn't be too much of a change.

[andrewdeandrade]

Hey @blakeembrey,

Thanks for opening this pull-request! Unfortunately, it looks like it fails to pass the criteria neccessary for submitting to bootstrap. The following things are currently failing:

• should always include a unit test if changing js files

For a full list of issue filing guidelines, please refer to the bootstrap issue filing guidelines.

thanks!

[GeoffTidey]

thanks for this @blakeembrey 👍

I've been pulling my hair out for a few hours with this....

[blakeembrey]

@abhisec Are you still having an issue with the tabs against my PR? I just tested it and it appears to be working.

[abhisec]

@blakeembrey thanks will try now. is this going to be merged if all looks rosy?

[blakeembrey]

@thezoggy @abhisec @GeoffTidey @zawaideh If you guys have time and are looking into fixes for touch and keyboard navigation still, could you please try my latest updates? Should contain a few fixes for touch navigation and plenty for keyboard.

[verschoof]

Is there a way to disable the keyboard navigation?
I only want to use this for the sub sub nav =)

[blakeembrey]

Should be able to just use $('body').off('keydown.dropdown.data-api');. Any reason in particular?

[verschoof]

1. extra unneeded functionality
2. It does not work in my application

So it works half now, and I don't want to spend "extra" time to find out how to fix this extra functionality.
thats why I prefer to disable it.

[blakeembrey]

@verschoof No problem. Thanks for your comments - I don't suppose you have example of the markup, etc. you are using? If you do, I can check it out (in case there is something I missed).

[blakeembrey]

@markdotto Could I find out why the pull request wasn't accepted?

[coling]

I would like to know too. I'm trying to track down the "official" final fix for issue #5094 so I can cherry pick it...

[mdo]

@blakeembrey I really don't know why this was closed. Phantom closures :. Will try to investigate at work.

[Yohn]

@mdo, I saw someone else say they all got closed out when the pull request was towards 2.1.2-wip and you or someone removed that branch

[mdo]

@Yohn Hmm, I never took any action to do that as far as I know. Very odd.

[Yohn]

@mdo, maybe it was because you renamed the 2.1.2-wip branch to 2,2,2-wip? im not sure what happened to that branch, but something did cause its not there

[jwg2s]

Does this work on the Android default browser?

EDIT: It does seem to work with default android browser.

[blakeembrey]

@jwg2s Thanks for the response. I never tested on Android - but this PR is fairly old now. I have got an updated copy of the script at https://raw.github.com/blakeembrey/fundamentum/master/js/dropdown.js (isn't written to Bootstrap standards, but fully compatible). If you want to give it a go I would be grateful, and it still contains all the previous changes and fixes I made.

[pseidemann]

hello,

unfortunately sub-submenus in the navbar still don't work in v2.2.2 on iOS.
the first submenu works but when I click on the second level, the whole dropdown gets closed. so it's impossible to click links in the second submenu

[blakeembrey]

@pseidemann This PR was closed and isn't likely to help with your issue. If you want - your welcome to try the file I linked to and see if it fixes your issues. On a side note, Bootstrap is removing dropdown submens in a future release.