JSF Ajax事件在表單中不起作用

Question

昨天，我創建了一個非常簡單的JSF項目，以練習如何使用Ajax請求呈現動態菜單。 添加方法效果很好，但是如果我切換到另一個選項卡，則不會計算結果並將其顯示在頁面中。 我調試了幾個小時的代碼，但直到現在我還沒有找到根本原因。 您知道問題可能是什么嗎？

網頁

index.xhtml：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://xmlns.jcp.org/jsf/html"
  xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
  xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
    <title>Mathematics</title>
</h:head>
<h:body>
    <h:panelGroup id="menu">
        <h:form>
            <f:ajax render="page">
                <h:commandButton value="Addition" action="#{menuMB.setPage('addition')}"></h:commandButton>
                <h:commandButton value="Subtraction" action="#{menuMB.setPage('subtraction')}"></h:commandButton>
                <h:commandButton value="Multiplication" action="#{menuMB.setPage('multiplication')}"></h:commandButton>
                <h:commandButton value="Division" action="#{menuMB.setPage('division')}"></h:commandButton>
            </f:ajax>
        </h:form>
    </h:panelGroup>
    <h:panelGroup id="page">
        <ui:include src="/WEB-INF/includes/#{menuMB.page}.xhtml"/>
    </h:panelGroup>
</h:body>
</html>

另外的.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
            xmlns:f="http://java.sun.com/jsf/core"
            xmlns:h="http://xmlns.jcp.org/jsf/html"
            xmlns:ui="http://java.sun.com/jsf/facelets">
<h:panelGroup id="header">
    <h1>Addition</h1>
</h:panelGroup>
<h:panelGroup id="content">
    <h:form id="addition">
        <h:outputLabel for="number1" value="Number1:"/>
        <h:inputText id="number1" value="#{mathMB.number1}">
            <f:ajax event="keyup" listener="#{mathMB.addition}" execute="number1 number2" render="result"/>
        </h:inputText>
        <h:outputLabel for="number2" value="Number2:"/>
        <h:inputText id="number2" value="#{mathMB.number2}">
            <f:ajax event="keyup" listener="#{mathMB.addition}" execute="number1 number2" render="result"/>
        </h:inputText>
        <h:outputLabel for="result" value="Result:"/>
        <h:outputText id="result" value="#{mathMB.result}"/>
    </h:form>
</h:panelGroup>

所有其他xhtml頁面（除法，乘法，減法）與上述相同，只有加法更改為適當的加法。

托管豆

MathMB

@ManagedBean
@RequestScoped
public class MathMB {

    private Integer number1;
    private Integer number2;
    private Integer result;

    public void addition() {
        if (number1 == null || number2 == null) {
            return;
        }
        result = number1 + number2;
    }

    subtraction...
    multiplication...
    division...

    //getters + setters
}

菜單MB

@ManagedBean
@ViewScoped
public class MenuMB implements Serializable {

    private String page;

    @PostConstruct
    public void init() {
        page = "addition";
    }

    public String getPage() {
        return page;
    }

    public void setPage(String page) {
        this.page = page;
    }
}

非常感謝您提供的任何提示！

Answer 1

您需要將<f:ajax>標記放在命令按鈕內，而不是相反。

<h:commandButton value="Addition" action="#{menuMB.setPage('addition')}">
    <f:ajax render="page"/>
</h:commandButton>
<h:commandButton value="Subtraction" action="#{menuMB.setPage('subtraction')}">
    <f:ajax render="page"/>
</h:commandButton>
...

JSF Ajax事件在表單中不起作用

問題描述

1 個解決方案

解決方案1
-1 2015-07-16 08:11:15

JSF Ajax事件在表單中不起作用

問題描述

1 個解決方案

解決方案1 -1 2015-07-16 08:11:15

解決方案1
-1 2015-07-16 08:11:15