<p: selectOneMenu caseSensitive = "true"> scheint keine Wirkung zu haben

Question

Ich habe folgende Auswahl eines Menüs. aber Groß- und Kleinschreibung funktioniert nicht darin. Wenn ich ein kleines oder ein großes A drücke, zeigt es immer ein kleines (je nachdem, was zuerst eintritt).

 <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> 

Meine Hauptversion ist 5.2.

Wenn das Auswahlfeld scharf ist. Ich drücke den alphabetischen Buchstaben "a" oder ich drücke den großen Buchstaben "A", in beiden Fällen zeigt er nur "a" in der Box (weil er zuerst in der Liste erscheint). Das ist tatsächliches Verhalten.

Mein erwartetes Verhalten ist, dass, wenn ich "a" drücke, es "a" setzt, und wenn ich "A" drücke, setzt es "A" in die Schachtel.

Was soll ich dafür tun?

Answer 1

Die Primefaces 5.2 documentation (Seite 430) sagt über Zeichengenauigkeit Option:

Legt fest, ob Filterung Fall empfindlich sein würde.

Diese Option gilt also nur, wenn Sie filter = "true" verwenden, und nur für die Werte, die Sie in die Filterbox eingeben.

Wenn Sie sich auf das SelectOneMenu-Steuerelement konzentrieren und einen Wert eingeben, wird bei der Suche immer die Groß-/Kleinschreibung nicht beachtet, wie Sie in der source code of Primefaces (line 848) sehen können. Beachten Sie, dass die Texte vor dem Vergleich in LowerCase platziert werden.

return $(this).text().toLowerCase().indexOf(text.toLowerCase()) === 0; 

---

Eine Möglichkeit (nicht sehr elegant) lösen Sie dieses Problem überschreiben die Primefaces für diese Filter verantwortlich funktionieren. Beachten Sie, dass andere SelectOneMenu-Steuerelemente auf derselben Seite auch in diesem Fall die Groß-/Kleinschreibung beachten.

So ist die Linie 848 so geworden wäre:

return $(this).text().indexOf(text) === 0; 

Ein weiteres Detail, das wahrscheinlich in Betracht gezogen werden sollte (wenn Sie wirklich die Funktion überschrieben werden soll) ist, dass auf line 842 of source code, verwirft Primefaces alle Einträge, die Shift haben Schlüssel.

metaKey = e.metaKey||e.ctrlKey||e.shiftKey; 

Daher ist diese Linie auch wie unten verändert werden soll Eintrag von Großbuchstaben zu erleichtern:

metaKey = e.metaKey||e.ctrlKey; 

Also, diese beiden Änderungen unter Berücksichtigung, und die final version of Primefaces 5.2 (minified), ist die Lösung einfach den folgenden hinzufügen Code irgendwo nach dem 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> 

Um zu testen, denken Sie daran, dass es a timer of 1 second zwischen jedem Tastendruck wird der Cache von Buchstaben zu löschen, die eingegeben wurden und ein neues Wort zu beginnen.

Answer 2

Obwohl dies nicht die perfekte Lösung ist, können Sie diese Problemumgehung verwenden. Verwenden Sie einen Filter. Auf diese Weise brauchen Sie einen weiteren "Klick", aber es funktioniert.

<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>