調用f：ajax keydown事件，但僅在按下左箭頭鍵時纔有效

有沒有好的做法，以下事件只能在左箭頭上調用ajax請求，否則會正常運行。調用f：ajax keydown事件，但僅在按下左箭頭鍵時纔有效

<h:selectOneMenu id="menuId" value="#{bean.value}" converter="entityConverter"> 
     <f:selectItem noSelectionOption="true" itemLabel="All Categories"/> 
     <f:selectItems value="#{bean.valueList" var="value" 
      itemLabel="#{value.subcatName}" itemValue="#{value}"/> 
      <f:ajax event="keydown" 
        listener="#{bean.goBack()}" 
        execute="@this"         
        render="@form" 
        onevent="function(data) { if (data.status === 'begin') { //is there something I can do here?}}"/> 
</h:selectOneMenu>

來源

2014-07-07 Landister

由於您似乎正在使用Primefaces，請利用其p:remoteCommand實用程序。它創建一個可用於製作Ajax請求的JavaScript函數。對於你的情況可能是：

@ManagedBean 
@ViewScoped 
public class SelectionBean implements Serializable { 

    private List<String> values = Arrays.asList("val1", "val2"); 

    private String selection; 

    public String getSelection() { 
     return selection; 
    } 

    public void setSelection(String selection) { 
     this.selection = selection; 
    } 

    public List<String> getValues() { 
     return values; 
    } 

    public void goBack() { 
     System.out.println("Going back..."); 
    } 

}

<html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:p="http://primefaces.org/ui"> 

<h:head /> 

<h:body> 

    <h:form> 
     <p:remoteCommand name="goBack" 
      actionListener="#{selectionBean.goBack}" /> 
     <script> 
      function processKey(e) { 
       if (e.keyCode == 37) { 
        goBack(); 
       } 
      } 
     </script> 
     <h:selectOneMenu value="#{selectionBean.selection}" 
      onkeydown="processKey(event);"> 
      <f:selectItems value="#{selectionBean.values}" /> 
     </h:selectOneMenu> 
    </h:form> 

</h:body> 
</html>

這裏我們使用一個輔助的JS函數用來檢查是否該事件的keyCode是一個左箭頭。如果爲true，則調用Primefaces生成的JS函數，這將觸發服務器端方法。

來源

2014-07-07 17:19:17

感謝Xtreme，它看起來可能是我必須做的。我們一直試圖儘可能避免primefaces，因爲它似乎有相當大的性能影響，但這應該起作用。 – Landister

@Landister，我在發佈PF 4和Mojarra 2.1.28之前測試瞭解決方案。 PF已經在它的5.0版本中，所以我認爲這是一個足夠成熟的框架，每個階段都有很多bug被修復。很明顯，它會加載CSS樣式和圖像以及一個JS文件，但是如果您在生產環境中正確啓用緩存瀏覽，則不會有任何擔心。 –

調用f：ajax keydown事件，但僅在按下左箭頭鍵時纔有效

回答

相關問題