1

JSF-2.0、Mojarra 2.1.19、PrimeFaces 3.4.1

それは私の前から見ることができるように。質問私はp:dataTable、ステータス/コメントモジュールの種類を表示できるようにするためにを使用しています。また、dataTable行のCSSを編集するJS/jQuery関数があります。

jQuery(document).ready(function() {
    var rowSize = '#{statusBean.size}';
    for (var i = 0; i < rowSize; i++) {
        var rowIndex = i;
        var inputTextStr = 'dataTableForm' + ':dataTable:' + rowIndex + ':commentInput';
        var inputText = $(document.getElementById(inputTextStr));
        inputText.css({'box-shadow':'0 0 5px #EB2F28'});
    }
});

そしてp:dataTable、通常のものであり、上記の関数によって変更されたCSSを持っているliveScrolling=true唯一のものがあると仮定します。p:inputText

p:dataTableに多数の行がある場合に問題が発生します。ユーザーが下にスクロールするとlive scroll、テーブルのイベントが発生し（ajaxリクエスト）、テーブルはより多くの行をロードしp:inputTextますが、通常のCSSでコンポーネントをロードします。関数は、cssを最近ロードされた行に適用できません。

したがって、そのliveScrollイベントをキャッチするか、JS機能が更新されるたびに機能することを保証する必要があります。p:dataTable

4

1 に答える 1

2

この状況を処理できる組み込みの AJAX イベントはないため、自分で処理する必要があります。私はあなたにいくつかの提案をしようとします。

まず、このための関数を作成して JavaScript を再編成し、読み込みページでその関数を呼び出します。

function applyMyCSS() {
    var rowSize = '#{statusBean.size}';
    for (var i = 0; i < rowSize; i++) {
        var rowIndex = i;
        var inputTextStr = 'dataTableForm' + ':dataTable:' + rowIndex + ':commentInput';
        var inputText = $(document.getElementById(inputTextStr));
        inputText.css({'box-shadow':'0 0 5px #EB2F28'});
    }
}

jQuery(document).ready(function() {
    applyMyCSS();
});

ここで、バッキング Bean でこの AJAX 要求を処理する必要があります。少し調べたところ、スクロールが発生するとyourDataTableId_scrolling、たとえばという名前の特定のパラメータが送信されmyForm:myTable_scrolling、このパラメータの値は であることがわかりましたtrue。

これをページのどこかに追加します。一番上のどこかに追加してください。

<f:metadata>
  <f:event type="preRenderView" listener="#{myBean.onPageLoad('clientIdOfComponent')}"/>
</f:metadata>

ページから正確なクライアント ID を入力してください。たとえば#{p:component('id')}、クライアント ID を取得するなど、いくつかのユーティリティ PrimeFaces 関数を使用できます。このイベントは、onPageLoad()ビュー レンダリングの前に、すべての要求 (AJAX または非 AJAX) に対して関数を呼び出します。その関数では、liveScrollイベントをフィルタリングして処理します。

public void onPageLoad(String datatableId) {
  FacesContext fc = FacesContext.getCurrentInstance();
  if (RequestContext.getCurrentInstance().isAjaxRequest() && 
          "true".equals(fc.getExternalContext().getRequestParameterMap().get(datatableId + "_scrolling")) {

    RequestContext.getCurrentInstance().execute("applyMyCSS()");
  }
}

これは文書化された動作ではなく、将来のバージョンで変更される可能性があることに注意してください (しかし、私はこれを期待していません)。この機能を追加するための問題も作成しましたが、すぐに追加される可能性があります。

于 2013-03-01T18:03:37.030 に答える