javascript - Primefaces SelectOneMenu selects item when ctrl+key (hotkey) is pressed -
i have jsf forms hotkeys, e.g., ctrl+s save data.
the problem is, when key combination pressed , focus on <p:selectonemenu>
field, first item starting s
(following example) selected , form submitted.
you can reproduce behavior in showcase, in first field, pressing ctrl+o. in chrome, @ least, it'll select first option , browser "open dialog".
i want component ignores letter when special key pressed.
i've tested behavior against select
html element , "combo box" jquery ui, , doesn't happen. primefaces implementation of selectonemenu different wrapper input field.
i tried return false
in both onkeyup
, onkeydown
attributes listed in pf user guide. no results.
i tried adding jquery keyboard event listeners preventdefault()
, return false
. nothing.
before digging primefaces code i'd know if there's known workaround case.
i checked out newer version of primefaces source svn repository. there javascript functions fixed in component.
then extracted fixed functions , put them in javascript file in order override original ones.
the code follows:
/** * fix selectonemenu when key pressed along ctrl */ primefaces.widget.selectonemenu = primefaces.widget.selectonemenu.extend({ bindkeyevents: function() { var $this = this; this.focusinput.on('keydown.ui-selectonemenu', function(e) { var keycode = $.ui.keycode, key = e.which; switch(key) { case keycode.up: case keycode.left: $this.highlightprev(e); break; case keycode.down: case keycode.right: $this.highlightnext(e); break; case keycode.enter: case keycode.numpad_enter: $this.handleenterkey(e); break; case keycode.tab: $this.handletabkey(); break; case keycode.escape: $this.handleescapekey(e); break; } }) .on('keyup.ui-selectonemenu', function(e) { var keycode = $.ui.keycode, key = e.which; switch(key) { case keycode.up: case keycode.left: case keycode.down: case keycode.right: case keycode.enter: case keycode.numpad_enter: case keycode.tab: case keycode.escape: break; default: var text = $(this).val(), matchedoptions = null; cleartimeout($this.searchtimer); matchedoptions = $this.options.filter(function() { return $(this).text().tolowercase().indexof(text.tolowercase()) === 0; }); if(matchedoptions.length) { var highlightitem = $this.items.eq(matchedoptions.index()); if($this.panel.is(':hidden')) { $this.selectitem(highlightitem); } else { $this.highlightitem(highlightitem); primefaces.scrollinview($this.itemswrapper, highlightitem); } } $this.searchtimer = settimeout(function(){ $this.focusinput.val(''); }, 1000); break; } }); } });
Comments
Post a Comment