0

テキスト ボックスに多くの Bootstrap Type-ahead が接続されています。そこのIDを使用して選択し、先行入力を添付していました。

サンプル

$("#SireTag").typeahead({
    source: function (query, process) {

        $.ajax({

            url: '/Bull/GetSireTag',
            type: 'POST',
            data: 'query=' + query,
            dataType: 'JSON',
                async: true,
                success: function (data) {
                    console.log(data);

                    process(data);
                }

            });
        }

    });

ここで、単一の Java スクリプト コードを使用して、すべてのテキスト ボックスに先行入力をアタッチすることで、より読みやすく短くすることにしました。

<input data-typeahead-url="/Bull/GetSireTag" id="SireTag" name="SireTag" type="text" value="">

新しい Javascript

 $('*[data-typeahead-url]')
        .each(function () {
            alert(this);
            $(this).typeahead({
                source: function (query, process) {
                    $.ajax({
                        url:  $(this).data("typeahead-url"),
                        type: 'POST',
                        data: 'query=' + query,
                        dataType: 'JSON',
                        async: true,
                        success: function (data) {
                            console.log(data);

                            process(data);
                        }
                    })
                }
            });

        });

しかし、うまくいかない私はJavaスクリプトにあまり精通していません。開発者ツールを試してみました ajax リクエストは行われません。

4

3 に答える 3

1

$('*[data-autocomplete-url]') は、data-typeahead-url を使用しているため、要素を選択しません。

于 2013-08-12T11:02:30.677 に答える
0

$('*[data-typeahead-url]') .each(関数 () {

 var url = $(this).data("typeahead-url");

 $(this).typeahead({
     source: function (query, process) {
         $.ajax({
             url: url,
             type: 'POST',
             data: 'query=' + query,
             dataType: 'JSON',
             async: true,
             success: function (data) {
                 console.log(data);

                 process(data);
             }
         })
     }
 });

});

問題: コードは ajax リクエストを行っていましたが、同じアドレスに送信されていました。診断:log($(this).data("typeahead-url");) 必要な出力が得られるかを試しました。解決策: URL を作成して保存し、ajax 呼び出しでパラメーターとして使用しました

var url = $(this).data("typeahead-url");

この助けを願っています。

于 2013-08-12T18:43:57.340 に答える
0

returnへのajax結果が必要です。デバッグにsourceも使用せず、代わりに使用してください：alert()console.log()

$('input[data-typeahead-url]').each(function () {
    $(this).typeahead({
        source: function (query, process) {
            return $.ajax({
                url:  $(this).data("typeahead-url"),
                type: 'POST',
                data: { query: query },
                dataType: 'json',
                async: true,
                success: function (resp) {
                    console.log(resp);

                    return process(resp);
                }
            });
        }
    });
});

それが役に立てば幸い。

于 2013-08-12T12:32:54.840 に答える