按Enter键不会通过p:defaultCommand命中预期的搜索按钮

时间:2016-04-05 14:09:26

标签: javascript jsf jsf-2 primefaces

我正在尝试使用primefaces,但它没有产生预期的结果。我的代码段位于

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

在上面的代码中,当我按下回车然后按下第一列按钮而不是预期的搜索,即使在使用primefaces p:defaultCommand之后。

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

有人建议我使用javascript手动点击搜索按钮,这也是失败的。也许是由于我的弱javascript知识。下面是带有javascript的代码片段,它也会点击第一列按钮而不是所需的搜索按钮

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

请有人帮助我。

1 个答案:

答案 0 :(得分:0)

我在为我的企业站点定义全局热键时遇到了同样的问题。对我有用的方法是:

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

使用此代码无论光标停留在何处,它都会在按Enter键时启动搜索功能。也许你想要它更精细一点然后你可以删除p:hotkey组件只用于启动你的搜索功能,如果光标在输入字段内。

需要javascript,因为p:hotkey组件可以在任何地方工作,除非光标停留在输入字段内。因此,您将远程命令绑定到视图中每个输入字段内的enter事件。