ajax 加载的数据表中的命令按钮不会调用它们的操作答案

【问题标题】：Commandbuttons inside ajax-loaded datatable doesn't invoke their actionsajax 加载的数据表中的命令按钮不会调用它们的操作
【发布时间】：2012-07-04 19:39:58
【问题描述】：

我有一个数据表。 dataTable 的数据是通过 ajax 填充的。表格中的一行包含了诸如按钮之类的表单元素。 datatTable 中的按钮应该指向另一个页面，但如果我点击它们，当前页面会被重新加载。

这里有一些代码：

支持 bean：

@ManagedBean(name="bean")
@SessionScoped
public class Bean {

private List<String> data;

@PostConstruct
public void postConstruct() {
    data = new ArrayList<String>();

}

public void fillTable() {
    data.add("E1");
    data.add("E2");
    data.add("E3");
}

public String outcome(){
    return "/faces/test/edit.jsf";
}

public List<String> getData() {
    return data;
}

public void setData(List<String> data) {
    this.data = data;
}

}

页面：

 <!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://java.sun.com/jsf/html" >
<h:body>
<h:form id="form">
<h:commandButton value="fillTable">
    <f:ajax listener="#{bean.fillTable()}" render="@form"/>
</h:commandButton>
<h:dataTable id="table" var="data" value="#{bean.data}">
    <h:column>
        <h:outputText value="#{data}" />
    </h:column>
    <h:column>
        <h:commandButton value="edit" action="#{bean.outcome}" />
    </h:column>
</h:dataTable>
</h:form>
</h:body>
</html>

我知道这与表单已经在 dom 中并且按钮被延迟加载到页面中有关（如果有人可以更具体，我会非常高兴）。

虽然如果我将支持 bean 的 Scope 更改为 SessionScope 它可以工作。按钮重定向到正确的页面。为什么？

【问题讨论】：

你没有过度简化代码吗？您在两个命令按钮上都使用了 PrimeFaces 特定的属性，这显然会失败。请不要在没有真正测试过生成的标准 JSF 代码的情况下粗心地抽象出任何组件库。 SO上有足够多的PrimeFaces用户，您不必担心获得答案的机会较少。
我已经编辑了我的问题并替换了 primefaces 的特定属性，希望它现在是纯 jsf。此外，我确定是可运行的代码，它证明了问题。
很公平。顺便说一句，您的第二个按钮中还有一个悬空的ajax="false"。虽然这将被完全忽略，但它仍然可能让其他假定为标准 JSF 的读者感到困惑。

标签： jsf

【解决方案1】：

虽然如果我将支持 bean 的 Scope 更改为 SessionScope 它可以工作。按钮重定向到右侧页面

该 bean 应该已放置在视图范围内。会话范围过于宽泛，只有在同一会话的多个浏览器窗口/选项卡中打开同一视图时才会出现不直观的行为。

解释如下：提交表单时，JSF需要识别按下的命令按钮，才能调用相关的动作方法。由于命令按钮被放置在数据表中，JSF 需要首先迭代其数据模型。但是，如果数据模型已更改或为空，则 JSF 将无法识别命令按钮。因此不会调用该操作。

当 bean 在请求范围内时，它将在响应结束时被丢弃，并在每个新请求期间重新创建，包括 ajax 请求。显然，所有 bean 的属性都会再次获得默认值，在您的情况下，data 属性也是如此。

另见：

commandButton/commandLink/ajax action/listener method not invoked or input value not updated - 特别是第 4 点。
How to choose the right bean scope?

【讨论】：