2010-03-11 8 views
3

У меня есть некоторые проблемы с простым приложением в JSF 2.0.Атрибут визуализации Ajax не работает в h: dataTable в JSF2

Я пытаюсь создать список ToDo с поддержкой ajax. У меня есть некоторые строки todo, которые я показываю с использованием данных. Внутри этого datatable у меня есть 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> 

Благодарим за помощь.

Edit (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 */ 
} 
+0

показать нам соответствующие части 'todoController' – Bozho

+0

кода Добавленной todoController – u2ix

ответ

5

(Похоже, у меня не хватает репутации комментировать ответы других людей)

Я думаю FRotthowe предлагает обертывание таблицу с другим элементом и ссылающуюся на нее с использованием абсолютной ссылки (т. е. именования всех родительских контейнеров из корня документа) из тега < f: ajax >.

Что-то вроде этого:

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

Но, используя абсолютные ссылки всегда является источником проблем и экспоненциально возрастает время рефакторинга как вид растет.

Не существует способа просто отрисовать таблицу от < f: ajax > тег (запретить jsf добавлять эти раздражающие «: number_of_row» в событие ajax)?

+0

теперь работает благодаря большому количеству – u2ix

+1

вместо обертки, используйте компонентный модуль для навигации по иерархии: codeturner

1

Я столкнулся с той же проблемой, и понял, что если поместить элемент (например) вокруг стола и что повторно вызывать, он будет работать. Однако я не совсем уверен, почему так. Кто угодно?

+0

Если я поместить элемент вокруг таблицы я получаю неизвестную ошибку ID – u2ix

+0

u2ix показать кода после добавления элемента wrapping. – Bozho

1

По какой-то причине JSF изменяет идентификатор в < f: ajax > тег в кнопке. Если я пишу это: 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> 

Обратите внимание, что идентификатор во втором кнопка «j_idt7: таблица: 0» в то время как я ожидал получить «j_idt7 : table ', как и в первом.

Это не решит проблему, но может помочь найти обходной путь.

+0

Правда, что j_idt7: table: 0 фактически относится к первой строке в dataTable. Не то чтобы это помогает, просто записка. Я полагаю, вы разделили элемент «h: form» из вашего кода примера для этого, поскольку элемент находится в произведенной разметке, но не в вашем исходном коде. –

+0

Да, тег h: form потерялся во время копирования и вставки. Исправлена. –

0

Вам нужно добавить prependId = «ложь» в свой час: форма

+0

, что dosn't help sry – u2ix

2

Я предполагаю, что < h: dataTable > прилагается к форме?

После борьбы с этой проблемой на некоторое время, я гугле легко и чистое решение: добавить @form для визуализации атрибута < F: АЯКС > и вуаля!

Полный пример:

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

0

Я столкнулся с той же проблемой.

Одна вещь, которая «работает» добавляет richfaces в свой проект, и замена

h:datatable 

по

rich:datatable. 

Какой будет генерировать правильный идентификаторы.

1

использовать этот код:

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