Ajax render attributo non funzionano in un h: dataTable in JSF2
Domanda
Ho qualche problema è con una semplice applicazione in JSF 2.0.
cerco di costruire una ToDo List con supporto Ajax. Ho alcune stringhe todo che ho display usando un DataTable. All'interno di questo DataTable ho un commandLink per eliminare un'attività. Il problema è ora che il DataTable non si ottiene nuovamente resa.
<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>
Grazie per il vostro aiuto.
Modifica (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 */
}
Soluzione
(Sembra che io non ho abbastanza fama di commentare le risposte degli altri)
Credo FRotthowe suggerisce avvolgendo la tabella con un altro elemento e confrontandola con riferimento assoluto (cioè nominare tutti i contenitori padre dalla radice del documento.) Dalla
Qualcosa di simile a questo:
<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>
Ma, utilizzando i riferimenti assoluti è sempre fonte di problemi e aumenta in modo esponenziale il tempo di refactoring come la vista si sviluppa.
Non c'è un modo per rendere solo la tabella da un
Altri suggerimenti
Si considera che il
Dopo aver lottato con questo problema per un po ', ho cercato con Google una soluzione semplice e pulita: aggiungere @form a rendere di attributo
Esempio completo:
<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>
L'articolo completo, che mi ha aiutato è qui: http://blogs.steeplesoft.com/2009/10/jsf-2-hdatatable-and-ajax-updates/
di questo codice:
<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>
Ho incontrato lo stesso problema e pensato che se si mette un elemento (ad esempio) intorno al tavolo e nuovamente sottoposti a rendering che, funzionerà. Non sono però del tutto sicuro perché è in questo modo. Chiunque?
Per qualche ragione JSF sta modificando l'id nel
<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>
ottengo questo 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>
Si noti che l'id nel secondo pulsante è 'j_idt7: tavolo: 0', mentre mi aspetto di ottenere. 'J_idt7: tavolo' come faccio io nel primo
che non risolve il problema, ma può aiutare a trovare una soluzione alternativa.
È necessario aggiungere prependId = "false" al tuo h: form
Ho incontrato lo stesso problema.
Una cosa che "funziona" è l'aggiunta RichFaces al progetto, e sostituendo il
h:datatable
da un
rich:datatable.
che genererà il corretto id.