首次提交时Ajax不起作用,页面刷新后只有刷新结果

时间:2017-12-12 03:18:56

标签: jsf primefaces

我正在使用带有JSF的Java EJB。

我所做的只是来自数据库的简单搜索结果,并使用带有ajax的JSF将其显示在表上。但是为什么在第一次提交时,结果不会出现。第二次只会出现结果。

以下是我的JSF页面代码

<h:form id="wholeForm">
    <p:panelGrid id="resultTable" styleClass="result_table1" >
        <p:row>
            <p:column>
                <div align="center" id="font-size1">  
                    <h:selectOneRadio value="#{scanResult.typeOfScan}">
                        <f:selectItem itemValue="Carrier" itemLabel="Carrier"></f:selectItem>
                        <f:selectItem itemValue="Slot" itemLabel="Slot"></f:selectItem>
                        <f:selectItem itemValue="HD" itemLabel="HD"></f:selectItem>
                        <p:ajax event="change"></p:ajax>
                    </h:selectOneRadio>
                    Scan:  <p:inputText  styleClass="searchField" id="counter" value="#{scanResult.serialNumber}" a:autofocus="true">
                        <p:ajax  event="keydown" update="wholeForm" onstart="if (event.keyCode != 13) { return false;}"  listener="#{scanResult.checkResult()}" />

                    </p:inputText>
                    <br/><br/>
                </div>
            </p:column>
        </p:row>
    </p:panelGrid>

    <p:panelGrid id="resultTable1" styleClass="result_table1" rendered="#{not empty scanResult.scanResultCarrier}" >

        <c:forEach  items="#{scanResult.scanResultCarrier}" var="result" >  
             <!-- ..do something and call out result -->
                </p:column>
            </p:row>
        </c:forEach>
    </p:panelGrid>
</h:form>

我的托管bean如下所示

@Named(value = "scanResult")
@SessionScoped
public class scanResult implements Serializable {

    //Some code here

    public void checkResult() {
        scanResultCarrier = new ArrayList<>();
        scanResultSlot = new ArrayList<>();

        System.out.println("checking");
        if (typeOfScan.equals("Carrier")) {
            System.out.println("Serial " + serialNumber);
            scanResultCarrier = scanresultcarrierFacade.searchResultCarrier(serialNumber);
            System.out.println(scanResultCarrier.size());
        } else if (typeOfScan.equals("Slot")) {
            scanResultSlot = scanresultslotFacade.searchResultSlot(serialNumber);
        } else if (typeOfScan.equals("HD")) {

        } else {

        }
        serialNumber = "";
    }
}

我使用System.out.println(lsitofresult.size());打印出我的结果,结果不是空白。意味着我成功从数据库中检索我的结果。

但是点击后输入我的结果表无法显示 然后我注意到我的url如下

  

http://localhost:8080/outgoingScanSystem-war/faces/index.xhtml;jsessionid=8b6cefa932ff60984607ee38ec13

刷新页面后,结果会再次显示 我的网址改为:

  

http://localhost:8080/outgoingScanSystem-war/faces/index.xhtml

我可以知道为什么吗?它与URL有关吗?我不知道我应该在哪里开始我的故障排除。有人可以给我一些指导吗?

1 个答案:

答案 0 :(得分:0)

我在这看到一些问题。首先,您正在使用会话范围,而您的托管bean应该是视图范围的(这里没有理由使用会话,请参阅下面的链接)。这就是刷新页面时显示结果的原因。

其次,我宁愿将搜索结果从表单中删除。我认为他们没有理由与搜索本身采用相同的形式。然后,在执行搜索时,您应该只更新结果列表:

<p:ajax event="keydown" update="resultTable1" onstart="if (event.keyCode != 13) { return false;}" listener="#{scanResult.checkResult()}" />

第三,当您使用Primefaces时,我建议您查看其p:remoteCommand工具,以便直接从JS代码执行对bean的基于jax的调用。这样你应该避免你的第二个问题,这似乎是你阻止标准表单发送ajax启动事件(甚至可能不会被调用)。你可以这样做:

<p:remoteCommand name="search" update="resultTable1" actionListener="#{scanResult.checkResult}" />
<p:inputText styleClass="searchField" id="counter" value="#{scanResult.serialNumber}" 
    a:autofocus="true" onkeypress="if (event.keyCode != 13) {search(); return false;}">
    <!-- Update the input text value in the bean for each pressed key -->
    <p:ajax event="keydown" />
</p:inputText>

另见: