5

JSF 2.0 の単純なアプリケーションに問題があります。

ajax をサポートする ToDo リストを作成しようとしています。データテーブルを使用して表示する todo 文字列がいくつかあります。このデータテーブル内には、タスクを削除するための 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>

ご協力いただきありがとうございます。

編集 (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 */
}
4

7 に答える 7

8

（他の人の回答にコメントするのに十分な評判がないようです）

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 が ajax イベントに迷惑な ":number_of_row" を追加するのを防ぎます)。

于 2010-04-12T08:09:33.507 に答える
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>
于 2012-08-12T16:26:42.283 に答える
2

<h: dataTable >はフォームで囲まれていると思いますか?

この問題にしばらく苦労した後、私は簡単でクリーンな解決策をグーグルで検索しました。

完全な例:

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

于 2012-02-10T23:34:10.753 に答える
1

私は同じ問題に遭遇し、テーブルの周りに要素 (例: ) を配置して再レンダリングするとうまくいくと考えました。しかし、なぜそうなのかはよくわかりません。誰？

于 2010-03-27T09:50:33.400 に答える
1

何らかの理由で、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>

私はこの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>

2 番目のボタンの id は 'j_idt7:table:0' ですが、最初のボタンと同様に 'j_idt7:table' を取得することを期待しています。

これで問題が解決するわけではありませんが、回避策を見つけるのに役立つ場合があります。

于 2010-03-31T03:56:07.593 に答える
0

h:form に prependId="false" を追加する必要があります

于 2010-04-02T04:02:59.997 に答える
0

私は同じ問題に遭遇しました。

「機能する」ことの1つは、プロジェクトにリッチフェイスを追加し、

h:datatable

によって

rich:datatable.

これにより、正しいIDが生成されます。

于 2012-02-22T14:33:43.790 に答える