Question

我有这个页面有4个输入文本，每个都有自己的按钮，现在如果我点击一个输入文本，焦点总是设置在顶部的commandButton上。

页面：

            <h:panelGrid columns="4">
                <h:outputLabel for="calSysCode">#{msgs.calSysCode}</h:outputLabel>
                <p:inputText id="calSysCode" label="#{msgs.calSysCode}" size="35" required="true" value="#{lookupBean.calSyscode}" >
                        <f:validator validatorId="syscodeValidator" />
                </p:inputText>                  
                <p:message for="calSysCode"/>
                <p:commandButton value="#{msgs.search}" process="@this, calSysCode, cboxWithDependencies" action="submitCalSysCode" update="@form"/>
                <h:outputLabel for="contractSysCode">#{msgs.contractSysCode}</h:outputLabel>
                <p:inputText id="contractSysCode" label="#{msgs.contractSysCode}" size="35" required="true" value="#{lookupBean.contrSyscode}" >
                        <f:validator validatorId="syscodeValidator" />
                </p:inputText>                  
                <p:message for="contractSysCode"/>
                <p:commandButton value="#{msgs.search}" process="@this, contractSysCode, cboxWithDependencies" action="submitContrSysCode" update="@form"/>
                <h:outputLabel for="employeeSysCode">#{msgs.employeeSysCode}</h:outputLabel>
                <p:inputText id="employeeSysCode" label="#{msgs.employeeSysCode}" size="35" required="true" value="#{lookupBean.employeeSyscode}" >
                        <f:validator validatorId="syscodeValidator" />
                </p:inputText>                  
                <p:message for="employeeSysCode"/>
                <p:commandButton value="#{msgs.search}" process="@this, employeeSysCode, cboxWithDependencies" action="submitEmployeeSysCode" update="@form"/>
                <h:outputLabel for="employerSysCode">#{msgs.employerSysCode}</h:outputLabel>
                <p:inputText id="employerSysCode" label="#{msgs.employerSysCode}" size="35" required="true" value="#{lookupBean.employerSyscode}" >
                        <f:validator validatorId="syscodeValidator" />
                </p:inputText>
                <p:message for="employerSysCode"/>
                <p:commandButton value="#{msgs.search}" process="@this, employerSysCode" action="submitEmployerSysCode" update="@form"/>
            </h:panelGrid>

现在我想知道是否可以从每个inputTexts到每个按钮设置焦点？因此，当我单击calSyscode inputText并按enter键时，将使用calSyscode命令按钮，当我单击contractSyscode时，将使用合同syscode按钮。

编辑：如果您想使用primefaces，您需要使用此代码，它与Jigar相同，但有点适用于primefaces和jQuery

jQuery(PrimeFaces.escapeClientId('sysCodeForm:calSysCode')).keyup(function(event){
  if(event.keyCode == 13){
      jQuery(PrimeFaces.escapeClientId('sysCodeForm:calenderButton')).click();
  }
});

Answer 1

JQuery可以让您更轻松，您可以按照以下方式处理。

$("#id_of_textbox1").keyup(function(event){
  if(event.keyCode == 13){
    $("#id_of_button1").click();
  }
});

$("#id_of_textbox2").keyup(function(event){
  if(event.keyCode == 13){
    $("#id_of_button2").click();
  }
});

另见

Trigger button click with JavaScript on Enter key in Text Box

获取一个inputtext，将其设置为一个特定的commandButton

1 个答案: