0

HtmlInputText + カスタム レンダラーを拡張して Twitter Bootstrap html マークアップを作成するカスタム コンポーネントがあります。例えば:

<bf:inputText id="a" label="L1" value="#{dummyMB.str}" formLayout="horizontal" labelSize="2" inputSize="6"/>

それはレンダリングします:

<div id="form:a-componente" class="form-group ">
    <label for="form:a" class=" control-label col-md-2">L1</label>
    <div class="col-md-3 ">
        <input id="form:a" type="text" name="form:a" class="form-control form_a" dir="ltr">
    </div>
</div>

ajax render 属性を介してこの特定のコンポーネントを更新する必要があるまで、すべてが正常に機能します。コンポーネントは html マークアップを失います。

アヤックスの後:

<div id="form:a-componente" class="form-group ">
    <label for="form:a" class=" control-label col-md-2">L1</label>
    <div class="col-md-6 ">
        <input id="form:a" class="form-group " dir="">
    </div>
</div>

フォーム全体を ajax で更新しようとすると、できます。ah:panelGroup 内にネストすると機能します。

render 属性内の id を使用してコンポーネントを具体的に更新しようとした場合にのみ機能しません。

これは、カスタム コンポーネントの getStyleClass() のオーバーライドです。

    @Override
public String getStyleClass() {

    String styleClass = super.getStyleClass();
    if(StringUtils.isEmpty(styleClass)) {
        styleClass = "";
    }

    if(!styleClass.contains(BFConstantes.DEFAULT_STYLE_CLASS)) {
        styleClass += BFConstantes.DEFAULT_STYLE_CLASS;
    }

    if(!styleClass.contains(FaceletsFunctions.styleClassId(this))) {
        // O JSF usa o caracter ":" para identificar o componente
        // O jQuery usa o caracter ":" como reservado
        // Para evitar o conflito, eu substituo os ":" do id do componente por "_" e adiciono como classe CSS
        // Assim o jQuery o código referenciar os componentes JSF individualmente.
        styleClass += FaceletsFunctions.styleClassId(this);
    }

    setStyleClass(styleClass);
    return super.getStyleClass();
}
4

1 に答える 1

0

多くの調査の結果、これは Java、JSF、または AJAX の問題ではないことがわかりました。

JQueryの問題です。

質問に基づいて解決できました:

JSF Ajax レンダリングは Jquery Mobile で CSS を失います

于 2015-02-02T11:25:31.330 に答える