Атрибут рендеринга Ajax не работает в h: dataTable в JSF2

Question

У меня есть проблемы с простым приложением в JSF 2.0.

Я пытаюсь создать список дел с поддержкой ajax. У меня есть несколько строк todo, которые я отображаю, используя данные. Внутри этой таблицы данных у меня есть команда Link для удаления задачи. Проблема в том, что данные не перерисовываются.

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

Answer 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 добавлять раздражающие ": number_of_row" в событие ajax)?

Answer 2

используйте этот код:

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

---

Answer 3

Я предполагаю, что заключен в форму?

После некоторой борьбы с этой проблемой я нашел простое и понятное решение: добавьте @ form к render атрибут и вуаля!

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

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

Answer 4

По какой-то причине JSF изменяет идентификатор втег в кнопке.Если я напишу этот 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: table: 0», пока я ожидаючтобы получить 'j_idt7: table', как я сделал в первом.

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

Answer 5

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

Answer 6

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

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

h:datatable 

от

rich:datatable. 

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

Answer 7

Вам нужно добавить prependId = "false" к вашей h: form