web-dev-qa-db-ja.com

update = "@（。myClass）"のようなPrimeFaces Selectorsはどのように機能しますか？

PrimeFaces selectors （ [〜＃〜] pfs [〜＃〜] ）の仕組みがわかりません。

<h:outputText value="#{bean.text1}" styleClass="myClass" />
<p:commandButton update="@(.myClass)" />

使用できます。そして、私にとっては常に機能するとは限りませんが、素晴らしいツールだと思います。 .myClassはクライアント側のjQueryセレクターです。サーバー側のJSFはどのように更新するのかを知っていますか？

通常の JSF IDセレクター の動作を理解できます。

<h:outputText value="#{bean.text1}" id="textId" />
<p:commandButton update="textId" />

textIdは、サーバー側のXHTMLファイルで定義されているコンポーネントツリーのコンポーネントのIDを参照します。そのため、JSFが適切なコンポーネントを見つける方法を理解できます。

ただし、primefacesセレクターを使用している場合は、クライアント側のjQueryセレクターが使用されます。 JSFは、どのコンポーネントを更新する必要があるかをどのように知るのですか？ PFSに問題がある場合があります。私にはいつも機能するとは限りません。 PFSを使用している場合に留意すべきことはありますか？

jsfjsf-2primefacesjquery-selectors
35
John N

PrimeFacesがjQueryを使用していることをご存知でしょう。 PrimeFaces SelectorsはjQueryに基づいています。 @(...)で指定したものはすべて、現在のHTML DOMツリーでjQueryセレクターとして使用されます。 IDを持つHTML要素が見つかった場合、最終的には正確にこのIDがupdateで使用されます。

基本的に、update="@(.myclass)"の場合、PrimeFacesはおおまかにこれを行います。

_var $elements = $(".myclass");
var clientIds = [];

$.each($elements, function(index, element) {
    if (element.id) {
        clientIds.Push(":" + element.id);
    }
});

var newUpdate = clientIds.join(" "); // This will be used as `update` instead.
_

だから、例えば.

_<h:form id="formId">
    <h:outputText id="output1" styleClass="myclass" ... />
    <h:outputText styleClass="myclass" ... />
    <h:outputText id="output3" styleClass="myclass" ... />
</h:form>
_

このコマンドボタンの更新

_<p:commandButton ... update="@(.myclass)" />
_

とまったく同じ効果になります

_<p:commandButton ... update=":formId:output1 :formId:output3" />
_

これは、自動生成されたIDでも機能することに注意してください。つまり_<h:form id>_は必須ではありません。

時々PFSに問題があります。 PFSを使用している場合に留意すべきことはありますか？

「多すぎる」を選択した場合があります（たとえば、@(form)は現在のフォームを選択しませんが、allフォームはまったく同じです。 $("form") jQuery！）、または実際に何も選択しなかったこと（目的のHTML DOM要素に実際にIDがない場合）。 HTML DOMツリーの要素IDとHTTPトラフィックモニターのリクエストペイロードを調べると、手がかりが得られます。

HTML DOMツリーの目的の要素mustには（自動生成された）IDがあります。 HTTPトラフィックモニターの_javax.faces.partial.render_要求パラメーターmustには正しいクライアントIDが含まれています。 JSFコンポーネントツリーの要素のrendered属性must更新時にtrueを評価します。等。

特定の例では、_<h:outputText>_は、IDを含む生成されたHTML出力にはなりません。 idを割り当てると、更新に関する問題を解決できます。

したがって、この例は機能しません

_<h:form>
    <h:outputText value="#{bean.text1}" styleClass="myClass" />
    <p:commandButton value="Update" update="@(.myClass)" /> 
</h:form>
_

ただし、この例は機能します（フォームにIDを割り当てる必要はありません）。

_<h:form>
    <h:outputText id="myText" value="#{bean.text1}" styleClass="myClass" />
    <p:commandButton value="Update" update="@(.myClass)" /> 
</h:form>
_
64
BalusC