0

2.0.0バージョンを使用すると、間違いなく適切なデータ結果を返す次のコードがありますが、何らかの理由で、ブートストラップの先行入力プラグインでエラーが発生します。コードサンプルの下に貼り付けました。

<input id="test" type="text" />

$('#test').typeahead({
    source: function(typeahead, query) {
        return $.post('/Profile/searchFor', { query: query }, function(data) {                
            return typeahead.process(data);
        });
    }
});

この例を実行すると、次のようなjQueryのバグが発生します。

**
item is undefined
matcher(item=undefined)bootst...head.js (line 104)
<br/>(?)(item=undefined)bootst...head.js (line 91)
<br/>f(a=function(), b=function(), c=false)jquery....min.js (line 2)
<br/>lookup(event=undefined)bootst...head.js (line 90)
<br/>keyup(e=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, more...})bootst...head.js (line 198)
<br/>f()jquery....min.js (line 2)
<br/>add(c=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, <br/>more...})jquery....min.js (line 3)
<br/>add(a=keyup charCode=0, keyCode=70)jquery....min.js (line 3)
<br/>[Break On This Error]  
<br/>return item.toLowerCase().indexOf(this.query.toLowerCase())**

何かご意見は？...同じコードがプラグインの2.0.0バージョンで機能しますが、ノックアウトオブジェクトモデルへの書き込みに失敗します。

これは、2.0.0バージョンで機能する先行コードです。

var searchFunction = function(typeahead, query) {
        $.ajax({
            url: "/Profile/searchFor?tableName=" + tableName + "&query=" + query + "&extendedData=" + $("#" + extendedData).val(),
            success: function(data) {
                if (data.errorText != null) {
                    toggleLoading("false");
                    showDialog(data.errorText, "Error");
                    return;
                }                
                var result = data.results.split("::");
                typeahead.process(result);
            },
            select: function(event, ui) {
            }
        });
    }

    $("#" + inputBoxId).typeahead({
        source: searchFunction,
        onselect: function(obj) {
        }
    });
4

3 に答える 3

4

1）ブートストラップtypeaheadv2.0.2ソリューション

このプルリクエストを見てください。探しているもののように見えます（ブートストラップtypeahead v2.0.2からのフォーク）。

私はそれを自分で使用し、それは機能しています:)

2）Bootstraptypeaheadv.2.1.0-進行中のソリューション

また、このソリューションを試すことができます。これを使用するようにプロジェクトを変更しました。これは、将来のバージョンでサポートされる予定であり、見た目がすっきりしているためです:)

私の場合：

$("#typeahead").typeahead({
  source: function(query, process) {
    $.post('url_path', { q: query, limit: 4 }, function(data) {
      process(data);
    }); // end of post
  }
});

スクリプトurl_pathが2つの引数q（文字列）とlimit（結果の制限）を要求し、json応答（配列）を返す場合：

制限4のクエリiへの応答例：

["エミネム"、 "リンプビズキット"、 "リアーナ"、"ウィルスミス"]

于 2012-07-06T19:14:49.227 に答える
2

（php json_encodeを使用せずに）JSONデータを生成しようとして、TerryRosenによるbootstrap-typeaheadフォークがajax呼び出しで機能しない理由を疑問に思っている人のために

返されるJSONデータの形式は、次の形式である必要があります：-

[{"id"： "1"、 "name"： "Old car"}、{"id"： "2"、 "name"： "Castro trolley car"}、{"id"： "3"、 " name "：" Green classiccars "}、{" id "：" 4 "、" name "："AntiqueRowに駐車した車"}]

引用符に注意してください

問題が何であるかを理解するために一日を費やしたので、私はそれをここに投稿するのが賢明だと思いました。たぶん、JSONの私の理解は間違っていましたが、firebugは、idフィールドとnameフィールドが引用符で囲まれていない場合でも、返されたデータを有効なJSONとして表示します。さらに、応答ヘッダーは「application/json」に設定する必要があります。これが誰かを助けることを願っています。

于 2012-08-06T11:50:33.410 に答える
1

バージョン2.0.4では、先行入力はバグがあり、関数をソースとして受け入れず、配列のみを受け入れます。2.1にアップグレードしましたが、期待どおりに動作します。

于 2012-08-26T12:04:36.083 に答える