Drücken Sie die Eingabetaste nicht die erwartete Suche Schaltfläche über p: defaultCommand

Question

Ich versuche zu verwenden, aber es produziert nicht erwartetes Ergebnis. Mein Code-Schnipsel unter

<h:form id="searchForm" styleClass="searchForm">  
    <p:panelGrid columns="3"> 
     <p:commandButton id="left-overlay-btn" value="" styleClass="xschnapp-search-filter-menu" /> 
     <p:inputText required="true" placeholder="#{cc.attrs.searchTip}" value="#{cc.attrs.queryProperty}" /> 
     <p:commandButton value="&#160;" id="searchButton" action="#{cc.attrs.searchAction}" styleClass="xschnapp-search-action" /> 
    </p:panelGrid> 
    <p:defaultCommand target="searchButton"> 
</h:form> 

oben Code, wenn ich die Eingabetaste drücken dann trifft es die erste Spalte Taste und nicht die erwartete Suche auch nach primefaces p mit: defaultcommand.

http://blog.primefaces.org/?p=1787

Jemand adviced mich Javascript zu verwenden manuell Suchtaste klicken, das ist auch scheitern. Vielleicht aufgrund meines schwachen Javascript-Wissens. Im Folgenden finden Sie Codeausschnitt mit Javascript und dass auch erste Spalte Taste anstelle der gewünschten Suchtaste Hit

<h:form id="searchForm" styleClass="searchForm" onkeypress="if (event.keyCode == 13) {document.getElementById('searchButton').click(); return false}">  
     <p:panelGrid columns="3"> 
      <p:commandButton id="left-overlay-btn" value="" styleClass="xschnapp-search-filter-menu" /> 
      <p:inputText required="true" placeholder="#{cc.attrs.searchTip}" value="#{cc.attrs.queryProperty}" /> 
      <p:commandButton value="&#160;" id="searchButton" action="#{cc.attrs.searchAction}" styleClass="xschnapp-search-action" /> 
     </p:panelGrid> 
</h:form> 

bitte jemand mir helfen kann.

Answer 1

Ich hatte das gleiche Problem, globalen Hotkey für meine Unternehmens-Website zu definieren. Die aproach, die für mich gearbeitet ist:

<h:form id="form"> 
    <p:hotkey bind="Enter" update="msg" actionListener="#{yourBean.yourSearchfunction}"/> 
    <p:remoteCommand name="search" actionListener="#{yourBean.yourSearchfunction}" update="msg"/> 
    //Your code 
</h:form> 
<h:outputScript> 
$(':input').bind('keydown', 'Enter', function() { 
    search(); 
    return false; 
}); 
</h:outputScript> 

Mit diesem Code unabhängig davon, wo Sie den Cursor bleibt es Ihre Suchfunktion starten auf die Eingabetaste drücken. Vielleicht möchten Sie es etwas feiner, dann können Sie die p: Hotkey-Komponente entfernen, um nur Ihre Suchfunktion zu starten, wenn sich der Cursor in einem Eingabefeld befindet.

Das Javascript wird benötigt, da die p: -Hotkey-Komponente überall funktioniert, außer wenn der Cursor in einem Eingabefeld bleibt. So binden Sie Ihren Remote-Befehl an das Enter-Ereignis in jedem Eingabefeld in der Ansicht.