Java Ajax 渲染属性在 JSF2 中的 ah:dataTable 中不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2424757/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-13 07:27:09  来源:igfitidea点击:

Ajax render attribute don't work in a h:dataTable in JSF2

javajsfjsf-2glassfish

提问by u2ix

I have some problem's with a simple application in JSF 2.0.

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

I try to build a ToDo List with ajax support. I have some todo strings which I display using a datatable. Inside this datatable I have a commandLink to delete a task. The problem is now that the datatable don't get re-rendered.

我尝试使用 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>

Thanks for your help.

谢谢你的帮助。

Edit (TodoController):

编辑(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 */
}

采纳答案by Toni Penya-Alba

(Looks like I don't have enough reputation to comment on others' answers)

(看起来我没有足够的声誉来评论其他人的答案)

I think FRotthowe suggests wrapping the table with another element and referencing it using absolute reference (ie. naming all the parent containers from the root of the document) from the <f:ajax> tag.

我认为 FRotthowe 建议用另一个元素包装表格并使用 <f:ajax> 标签中的绝对引用(即从文档的根命名所有父容器)来引用它。

Something like this:

像这样的东西:

<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>

But, using absolute references is always a source of problems and increases exponentially the refactoring time as the view grows.

但是,使用绝对引用始终是问题的根源,并且随着视图的增长,重构时间呈指数增长。

Isn't there a way to just render the table from a <f:ajax> tag (prevent jsf from adding those annoying ":number_of_row" in the ajax event)?

有没有办法只从 <f:ajax> 标签渲染表(防止 jsf 在 ajax 事件中添加那些烦人的“:number_of_row”)?

回答by FRotthowe

I ran into the same problem and figured that if you put an element (e.g. ) around the table and rerender that, it will work. I am however not quite sure why it is that way. Anyone?

我遇到了同样的问题,并认为如果您在表格周围放置一个元素(例如 )并重新渲染它,它将起作用。然而,我不太确定为什么会这样。任何人?

回答by Toni Penya-Alba

For some reason JSF is modifying the id in the <f:ajax> tag in the button. If I write this xhtml:

出于某种原因,JSF 正在修改按钮中 <f:ajax> 标记中的 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>

I get this html:

我得到这个 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>

Notice that the id in the second button is 'j_idt7:table:0' while I'm expecting to get 'j_idt7:table' as I do in the first one.

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

That doesn't solve the problem but may help to find a workaround.

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

回答by user307434

You need to add prependId="false" to your h:form

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

回答by zarazek

I assume that the <h:dataTable>is enclosed by a form?

我假设<h:dataTable>包含在表单中?

After struggling with this issue for a while, I googled an easy and clean solution: add @formto renderattribute of <f:ajax>and voila!

在这个问题上挣扎了一段时间后,我用谷歌搜索了一个简单而干净的解决方案:添加@form<f:ajax> 的渲染属性,瞧!

Full example:

完整示例:

<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>

The full article which helped me is here: http://blogs.steeplesoft.com/2009/10/jsf-2-hdatatable-and-ajax-updates/

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

回答by IJC

I ran into the same problem.

我遇到了同样的问题。

One thing that "works" is adding richfacesto your project, and replacing the

“有效”的一件事是为您的项目添加丰富的面孔,并替换

h:datatable 

by a

由一个

rich:datatable. 

Which will generate the correct id's.

这将生成正确的 id。

回答by shahab kondri

use this code:

使用此代码:

<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>