Ajax 渲染属性在 JSF2 中的 h:dataTable 中不起作用答案

【问题标题】：Ajax render attribute don't work in a h:dataTable in JSF2Ajax 渲染属性在 JSF2 中的 h:dataTable 中不起作用
【发布时间】：2011-01-26 08:31:09
【问题描述】：

我在 JSF 2.0 中的一个简单应用程序有一些问题。

我尝试构建一个支持 ajax 的待办事项列表。我有一些使用数据表显示的待办事项字符串。在这个数据表中，我有一个 commandLink 来删除一个任务。现在的问题是数据表没有被重新渲染。

    <h:dataTable id="todoList" value="#{todoController.todos}" var="todo">
        <h:column>
                <h:commandLink value="X" action="#{todoController.removeTodo(todo)}">
                    <f:ajax execute="@this" render="todoList" />
                </h:commandLink>
        </h:column>
        <h:column>
            <h:outputText value="#{todo}"/>
        </h:column>
    </h:dataTable>

感谢您的帮助。

编辑（TodoController）：

@ManagedBean
@SessionScoped
public class TodoController {

private String todoStr;
private ArrayList<String> todos;

public TodoController() {
    todoStr="";
    todos = new ArrayList<String>();
}

public void addTodo() {
    todos.add(todoStr);
}

public void removeTodo(String deleteTodo) {
    todos.remove(deleteTodo);
}

/* getter / setter */
}

【问题讨论】：

向我们展示todoController的相关部分

标签： java jsf jsf-2 glassfish

【解决方案1】：

（看起来我没有足够的声望来评论别人的答案）

我认为 FRotthowe 建议用另一个元素包装表格，并使用标记中的绝对引用（即从文档的根目录命名所有父容器）来引用它。

类似这样的：

<h:form id="form">
    <h:panelGroup id ="wrapper">
        <h:dataTable value="#{backingBean.data}" var="list">
            <h:column>
                <h:commandButton value="-" action="#{backingBean.data}">
                    <f:ajax render=":form:wrapper"/>
                </h:commandButton>
            </h:column>
    </h:dataTable>
    </h:panelGroup>
</h:form>

但是，使用绝对引用始终是问题的根源，并且随着视图的增长，重构时间会成倍增加。

有没有办法只从标记呈现表格（防止 jsf 在 ajax 事件中添加那些烦人的“:number_of_row”）？

【讨论】：

使用组件模块而不是包装器来向上导航层次结构：

【解决方案2】：

我遇到了同样的问题。

“有效”的一件事是将 richfaces 添加到您的项目中，并替换

h:datatable

由一个

rich:datatable.

这将生成正确的 id。

【讨论】：

【解决方案3】：

使用此代码：

<h:form id="form">
<h:panelGroup id="panel">
    <h:dataTable id="todoList" value="#{todoController.todos}" var="todo">
        <h:column>
                <h:commandLink value="X" action="#{todoController.removeTodo(todo)}">
                    <f:ajax render=":form:panel" />
                </h:commandLink>
        </h:column>
        <h:column>
            <h:outputText value="#{todo}"/>
        </h:column>
    </h:dataTable>
</h:panelGroup>
</h:form>

【讨论】：

【解决方案4】：

我假设包含在一个表单中？

在为这个问题苦苦挣扎了一段时间后，我在谷歌上搜索了一个简单而干净的解决方案：将 @form 添加到 render 属性中/strong> 瞧！

完整示例：

<h:form id="theForm">
    <h:dataTable id="table" value="#{tasksMgr.allTasks}" var="task">

        <h:column>
           #{task.name}
        </h:column>

        <h:column>
            <h:commandButton id="removeTaskButton" value="X" action="#{tasksMgr.removeTask(task)}">
                <f:ajax render="@form" />
            </h:commandButton>
        </h:column>
    </h:dataTable>
</h:form>

对我有帮助的完整文章在这里：http://blogs.steeplesoft.com/2009/10/jsf-2-hdatatable-and-ajax-updates/

【讨论】：

【解决方案5】：

出于某种原因，JSF 正在修改按钮中标记中的 id。如果我写这个 xhtml：

<h:form id="form">
    <h:commandButton value="Button">
        <f:ajax render="table"/>
    </h:commandButton>

    <h:dataTable id="table" value="#{tableData.data}">
        <h:column>
            <h:commandButton value="Button">
                <f:ajax render="tocoto"/>
            </h:commandButton>
        </h:column>
    </h:dataTable>
</h:form>

我得到了这个 html：

<form id="j_idt7" name="j_idt7" method="post" action="/WebApplication1/faces/index.xhtml" enctype="application/x-www-form-urlencoded">
    <input type="hidden" name="j_idt7" value="j_idt7" />
    <input id="j_idt7:j_idt8" type="submit" name="j_idt7:j_idt8" value="Button" onclick="mojarra.ab(this,event,'action',0,'j_idt7:table');return false" />

    <table id="j_idt7:table"><tbody>
        <tr>
            <td><input id="j_idt7:table:0:j_idt10" type="submit" name="j_idt7:table:0:j_idt10" value="Button" onclick="mojarra.ab(this,event,'action',0,'j_idt7:table:0');return false" /></td>
        </tr>
    </tbody></table>

     <input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="-7634557012794378167:1020265910811114103" autocomplete="off" />
</form>

请注意，第二个按钮中的 id 是“j_idt7:table:0”，而我希望像第一个按钮一样获得“j_idt7:table”。

这并不能解决问题，但可能有助于找到解决方法。

【讨论】：

没错，那个 j_idt7:table:0 实际上是指数据表中的第一行。并不是说它有帮助，只是一个注释。我想您为此从示例代码中删除了 h:form 元素，因为该元素在生成的标记中，但不在您的源代码中。
是的，h:form 标签在复制和粘贴过程中丢失了。固定。

【解决方案6】：

您需要将 prependId="false" 添加到您的 h:form

【讨论】：

【解决方案7】：

我遇到了同样的问题，并认为如果你在桌子周围放置一个元素（例如）并重新渲染它，它会起作用。但是，我不太确定为什么会这样。有人吗？

【讨论】：

如果我在桌子周围放一个元素，我会得到一个未知的 id 错误
u2ix 显示添加包装元素后的代码。