1

データを表示するための JSF ページで、並べ替えと列の並べ替えが有効になっている OpenFaces データテーブルを適切なバッキング Bean プロパティに保存しました (o:dataTable 要素の sortColumnId、sortAscending、columnsOrder 属性を介して)。対応するインライン編集ページ (カスタム コードを使用して、テーブルの個々の行をユーザーが一度に 1 つずつ保存できるページ) では、データ テーブルの columnsOrder が同じプロパティにリンクされているため、列は同じ順序で表示されます。ただし、編集ページでの列の並べ替えを防ぐために、データテーブルには o:columnReordering 要素がありません。これが必要になるのは、列の移動によって開始された AJAX 呼び出しが、部分応答 XML のエラーが原因で失敗し、テーブルを更新できないためです。

編集ページのデータテーブルを表示ページと同じ順序でソートできるようにしたいのですが、ソートも無効にします。ただし、これは OpenFaces では不可能のようです。編集ページのデータブルを同じバッキング Bean プロパティにリンクしましたが、並べ替えられた列を並べ替えて表示するには、o:column タグに sortingExpression 属性が必要です。その属性が列に追加されると、その列は、ユーザーが列ヘッダーをクリックしてソート可能になります。追加されていない場合、ユーザーは列をソートできませんが、バッキング Bean プロパティでソートする列として指定されていても、テーブルはその列でソートされません。

DOM が作成されたら、JQuery によって実行される JavaScript を使用して、OpenFaces 列ヘッダーの「th」要素のクリック イベントによって呼び出される関数を上書きしようとしましたが、関数を呼び出した後、テーブルを並べ替えて更新する AJAX 呼び出しはまだ呼ばれています。使用されるコードは次のとおりです。

Edit.xhtml で:

<script type="text/javascript">
    $(document).ready(function() {
        $('#doorNumberColumnHeader').parents('th').onclick = null;
        $('#doorNumberColumnHeader').parents('th').click(function(event) {
            alert("Preventing AJAX call");

            if (event) {
                event.preventDefault ? event.preventDefault() : event.returnValue = false;
            }

            return false;
          });
      });
</script>

Edit.xthml の OpenFaces データテーブル内:

<o:column id="doorNumberColumn" sortingExpression="#{submission.doorNum}" fixed="true" width="50px">
    <f:facet name="header">
        <h:outputText value="#{bundle.SubmissionDoorNumber}" id="doorNumberColumnHeader"/>
    </f:facet>
    <h:outputText value="#{submission.doorNum}"/>
</o:column>

ユーザーがテーブルの並べ替え順序を変更できないようにする AJAX 呼び出しを防止するためのより良い方法はありますか?

ありがとう。

4

1 に答える 1

1

興味のある方のために説明すると、私の質問に対する答えは、DOM の作成後に OpenFaces JavaScript の _reload() 関数を上書きすることでした。これにより、同じページ上の OpenFaces コンポーネントが AJAX 呼び出しを実行できなくなる可能性があることを理解しています (ただし、問題のページにはデータテーブルが 1 つしかないため、問題にはなりません)。

<script type="text/javascript">
    $(document).ready(function() {
        // Prevent OpenFaces datatable component from sending AJAX requests!
        window.OpenFaces.Ajax._reload = function(one, two, three) {
            // Do nothing!
        };
    });
</script>

このソリューションは、ページ内で他の AJAX 呼び出しが行われることを妨げないため、a4j:commandButton を引き続き使用できます。

于 2012-04-02T16:14:37.667 に答える