Ajax 在第一次提交时不起作用，页面刷新后只有结果才会刷新

Question

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

我所做的只是从数据库中获取一个简单的搜索结果，并将其显示在使用 JSF 和 ajax 的表格上。但是为什么第一次提交时没有出现结果。第二次只会出现结果。

下面是我的 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

我可以知道为什么吗？它与网址有关吗？我不知道我应该从哪里开始我的故障排除。谁能给我一些指导？

Answer 1

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

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

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

第三，当您使用 Primefaces 时，我鼓励您查看它的 p:remoteCommand 工具，以便直接从您的 JS 代码对 bean 执行基于 ajax 的调用。这样你应该避免你的第二个问题，这似乎是你阻止了在 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>

另请参阅：

• How to choose the right bean scope?
• Jsf calling bean method from input text when pressing enter