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支持构建一个ToDo列表。我有一些todo字符串,我用datatable显示。在这个datatable中,我有一个commandLink来删除一个任务。现在的问题是datatable没有被重新呈现。
<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 */
}
7 个解决方案
#1
6
(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建议用另一个元素来包装这个表,并使用绝对引用来引用它。从
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)?
是否有一种方法可以将表从
#2
2
I assume that the <h:dataTable> is enclosed by a form?
我假设
After struggling with this issue for a while, I googled an easy and clean solution: add @form to render attribute of <f:ajax> and voila!
在与这个问题进行了一段时间的斗争之后,我搜索了一个简单而干净的解决方案:添加@form来呈现
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.com/2009/10/jsf -2-hdatatable- ajax-updates/。
#3
1
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?
我遇到了同样的问题,并认为如果您将一个元素(例如)放在表中并重新运行它,它就会工作。但我不太清楚为什么会这样。有人知道吗?
#4
1
For some reason JSF is modifying the id in the <f:ajax> tag in the button. If I write this xhtml:
出于某种原因,JSF正在修改
<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.
这并不能解决问题,但可能有助于找到解决方法。
#5
1
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>
#6
0
You need to add prependId="false" to your h:form
你需要给你的h添加prependId="false"。
#7
0
I ran into the same problem.
我遇到了同样的问题。
One thing that "works" is adding richfaces to your project, and replacing the
有一件事是“有效的”,那就是在你的项目中加入richfaces,然后替换。
h:datatable
by a
由一个
rich:datatable.
Which will generate the correct id's.
这将生成正确的id。
#1
6
(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建议用另一个元素来包装这个表,并使用绝对引用来引用它。从
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)?
是否有一种方法可以将表从
#2
2
I assume that the <h:dataTable> is enclosed by a form?
我假设
After struggling with this issue for a while, I googled an easy and clean solution: add @form to render attribute of <f:ajax> and voila!
在与这个问题进行了一段时间的斗争之后,我搜索了一个简单而干净的解决方案:添加@form来呈现
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.com/2009/10/jsf -2-hdatatable- ajax-updates/。
#3
1
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?
我遇到了同样的问题,并认为如果您将一个元素(例如)放在表中并重新运行它,它就会工作。但我不太清楚为什么会这样。有人知道吗?
#4
1
For some reason JSF is modifying the id in the <f:ajax> tag in the button. If I write this xhtml:
出于某种原因,JSF正在修改
<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.
这并不能解决问题,但可能有助于找到解决方法。
#5
1
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>
#6
0
You need to add prependId="false" to your h:form
你需要给你的h添加prependId="false"。
#7
0
I ran into the same problem.
我遇到了同样的问题。
One thing that "works" is adding richfaces to your project, and replacing the
有一件事是“有效的”,那就是在你的项目中加入richfaces,然后替换。
h:datatable
by a
由一个
rich:datatable.
Which will generate the correct id's.
这将生成正确的id。