1

複数のオートコンプリートフィールドを持つフォームを作成しようとしています。jQuery-ui 1.8.21を使用して、.autocompleteバインディングを介してオートコンプリートを実行しています。オートコンプリートがバインドされた5つの異なるフィールドがあり、それぞれがページの最後にあるフォームの外部の異なるdivに提案を送信します。

フォームは次のようになります。

<form>
    <input type="text" name="afield" />
    <input type="text" name="bfield" />
</form>
<div id="a_complete">
</div>
<div id="b_complete">
</div>

次のようなjQueryコード：

$(function(){
    $("[name=afield]").autocomplete({
        source: "/data/source/a",
        open: function(event, ui) {
        $('ul.ui-autocomplete')
            .removeAttr('style').hide().appendTo('#a_complete').show();
        }
    });
    $("[name=bfield]").autocomplete({
        source: "/data/source/b",
        open: function(event, ui) {
        $('ul.ui-autocomplete')
            .removeAttr('style').hide().appendTo('#b_complete').show();
        }
    });
});

これに伴う問題は、bfieldと入力し始めると、afieldの一致した結果がbfieldの結果と同様に*b_complete*にも表示されることです。

cacheLengthを0または1に設定し、さまざまなイベント（検索、開く、閉じる、選択）でflushCache（）を使用してみましたが、成功しませんでした。

これは表面的な問題にすぎませんが、結果をクリックすると適切なフィールドが更新され、矢印キーを使用して結果をウォークスルーすると、正しいフィールドの結果のみが返されます。

4

1 に答える 1

4

$('ul.ui-autocomplete')たとえば、別のクラス定義、つまり「id」を使用して、独自のものを作成する必要があります$('ul.ui-autocomplete#a')。$('ul.ui-autocomplete#b')

于 2012-06-12T17:54:41.010 に答える