<p: selectOneMenu caseSensitive = "true"> seems to have no effect
I have the following menu. but case sensitive does not work. when I press small a or capital A, it always shows small a (depending on what happens earlier).
<p:selectOneMenu id="tempSelect" caseSensitive="true"> <f:selectItem itemLabel="0" itemValue="0"/> <f:selectItem itemLabel="a" itemValue="a"/> <f:selectItem itemLabel="A" itemValue="A"/> <f:selectItem itemLabel="b" itemValue="b"/> </p:selectOneMenu> My right number is version 5.2.
When the selection box is in focus. I press the letter of the alphabet "a" or click the letter of the letter "A", in both cases it shows only "a" in the field (because it appears first in the list). This is the actual behavior.
My expected behavior is that when I press "a" it puts "a" and when I press "A" it puts "A" in the box.
What should I do for this?
The Primefaces 5.2 documentation (page 430) talks about the CaseSensitive option:
Determines whether filtering is case sensitive.
Thus, this parameter applies only if you use filter = "true" and only for the values that you enter in the filter field.
When you focus on the SelectOneMenu control and enter a value, the search will always be case insensitive, as you can see in the Primefaces source code (line 848) . Please note that texts are placed in LowerCase before comparison.
return $(this).text().toLowerCase().indexOf(text.toLowerCase()) === 0; One way (not very elegant) that you solve this problem is to override the Primefaces function responsible for this filter. Remember that in this case, other SelectOneMenu controls on the same page will also be case sensitive.
So line 848 will look like this:
return $(this).text().indexOf(text) === 0; Another detail that should probably be considered (if you really want to overwrite the function) is that on line 842 of the source code , all entries that have the Shift key.
metaKey = e.metaKey||e.ctrlKey||e.shiftKey; Therefore, this line should also be changed as shown below to facilitate capitalization:
metaKey = e.metaKey||e.ctrlKey; So, given these two changes, and the final version of Primefaces 5.2 (minified) , the solution is to simply add the following code somewhere after selecting SelectOneMenu.
<script> PrimeFaces.widget.SelectOneMenu.prototype.bindKeyEvents = function() { var a = this; this.focusInput.on("keydown.ui-selectonemenu", function(d) { var c = $.ui.keyCode, b = d.which; switch (b) { case c.UP: case c.LEFT: a.highlightPrev(d); break; case c.DOWN: case c.RIGHT: a.highlightNext(d); break; case c.ENTER: case c.NUMPAD_ENTER: a.handleEnterKey(d); break; case c.TAB: a.handleTabKey(); break; case c.ESCAPE: a.handleEscapeKey(d); break } }).on( "keyup.ui-selectonemenu", function(g) { var f = $.ui.keyCode, d = g.which; switch (d) { case f.UP: case f.LEFT: case f.DOWN: case f.RIGHT: case f.ENTER: case f.NUMPAD_ENTER: case f.TAB: case f.ESCAPE: case f.SPACE: case f.HOME: case f.PAGE_DOWN: case f.PAGE_UP: case f.END: case f.DELETE: case 16: case 17: case 18: case 224: break; default: var i = $(this).val(), c = null, h = g.metaKey || g.ctrlKey; if (!h) { clearTimeout(a.searchTimer); c = a.options.filter(function() { return $(this).text() .indexOf(i) === 0 }); if (c.length) { var b = a.items.eq(c.index()); if (a.panel.is(":hidden")) { a.selectItem(b) } else { a.highlightItem(b); PrimeFaces.scrollInView( a.itemsWrapper, b) } } a.searchTimer = setTimeout(function() { a.focusInput.val("") }, 1000) } break } }) } </script> To check, remember that there is a 1 second timer between each keystroke to clear the cache of letters that were entered and start a new word.
Although this is not an ideal solution, you can use this workaround. Use a filter. Thus, you will need another click, but it works.
<p:selectOneMenu id="tempSelect" caseSensitive="true" filter="true" filterMatchMode="startsWith"> <f:selectItem itemLabel="0" itemValue="0"/> <f:selectItem itemLabel="a" itemValue="a"/> <f:selectItem itemLabel="A" itemValue="A"/> <f:selectItem itemLabel="b" itemValue="b"/> </p:selectOneMenu>