programmatically open select drop down
I have created a Effective date drop down in my application using <select> and i want to open the drop down when a user presses enter key, which does not happen in firefox. I checked multiple forums but could not find a solution to do it. Can you please help? I tried doing this:
$(document).keyup(function(e) { if (e.keyCode == 13){ if($("#effDateStartMonth").is(":focus")){ e.preventDefault(); // Option 1 angular.element("#effDateStartMonth").triggerHandler('mousedown'); // Option 2 angular.element("#effDateStartMonth").mousedown(); /* Option 3 var event; event = document.createEvent('MouseEvents'); event.initMouseEvent('mousedown',true,true,window); this.dispatchEvent(event); */ } } })
Ilungisiwe
All Replies (3)
This forum has mixed results when you paste HTML. A leading space triggers a <pre> block. Omitting the comment block:
awebdeveloper said
$(document).keyup(function(e) { if (e.keyCode == 13){ if($("#effDateStartMonth").is(":focus")){ e.preventDefault(); // Option 1 angular.element("#effDateStartMonth").triggerHandler('mousedown'); // Option 2 angular.element("#effDateStartMonth").mousedown(); } } })
Are your libraries up-to-date? I have never used AngularJS, so it's a black box to me.
Firefox has various security rules about when keyboard and mouse actions can be generated by a script, or should I say, when they will be discarded as untrusted.
Do you see any messages in either of Firefox's consoles along those lines when your keyboard handler runs?
- Web Console - lower part of tab: https://developer.mozilla.org/docs/Tools/Web_Console
- Browser Console - separate window: https://developer.mozilla.org/docs/Tools/Browser_Console
Do you know how to do it using jquery? I will make it work for angularjs. Also, I am not getting any error in consoles, it just does not open drop down on key press.
I don't know jQuery well enough, either.
From what I see in search results, mousedown is a dead end. Lots of other ideas out there. For example:
https://stackoverflow.com/questions/17943475/how-to-open-option-list-of-html-select-tag-on-onfocus