0

ドロップダウンメニューがあります：

<ace:selectMenu value="#{MenuBean.cityList}" valueChangeListener="#{MenuBean.ChCountry}">
    <f:selectItems itemValue="cityList.id" itemLabel="cityList_nm_city" />
</ace:selectMenu>

都市リスト

および入力フィールド

<h:inputText id="form:nm" value="#{MenuBean.nm}" />

テキストボックス

jQueryオートコンプリートを使用する

$(document).ready(function() {
    $("#form\\:nm").autocomplete({
        source : function(request, response) {
            $.ajax({
                url : url,
                data : {
                    method : "getnm",
                },
                success : function(data) {
                    alert("success");
                }
            });
        }
    });
});

ドロップダウンを変更して JSF コンポーネントを更新すると、jQuery オートコンプリートが機能しなくなります。これはどのように発生し、どうすれば解決できますか?

4

1 に答える 1

2

私が正しければ、どこかで入力を再レンダリングしていると思います。

コンポーネントを再レンダリングしても$(document).ready関数は再度実行されないため、コンポーネントに接続され#form\\:nmないことに注意autocompleteしてください。を使用しf:ajaxてコンポーネントを更新する場合は、 をコンポーネントに接続する JS 関数を作成し、そのautocompleteで呼び出すだけoneventですf:ajax。

このようなもの：

function loadAutocompleteField(data) {
    if(data.status == "success") {
        $("#form\\:nm").autocomplete({
            source : function(request, response) {
                $.ajax({
                    url : url ,
                    data : {
                        method : "getnm",
                    },
                    success : function(data) {
                        alert("success");
                    }
                });
            }
        });
    }
}

繰り返しますが、たとえば、次を使用する場合f:ajax:

<f:ajax render="yourComponent" onevent="loadAutocompleteField" />

別のメカニズムを使用する場合は、loadAutocompleteField完了したら関数を呼び出すだけです。

編集

実際、私の最初の答えは非効率的でした。私の通常のアプローチは、ウィジェット関連の CSS を検索することでした。それが読み込まれている場合は、ウィジェットを再度配線することは避けます。f:ajaxの関数は、 ajaxonevent要求サイクル全体のステータスを含むデータ引数を受け取ることができることがわかります ( beforeajax 要求が送信される > completeajax 応答が到着したことを意味します > ajax 応答にsuccess基づいてコンポーネントを更新します)。

その引数を確認し、DOM が更新された後にのみコンポーネントを接続する必要があります。

これを整理するのを手伝ってくれた BalusC に感謝します。それはあなたにとってそうです、私は質問に答えることで何かを学びました.

于 2013-06-25T14:56:20.830 に答える