1

KendoUi オートコンプリート コントロールに読み込みたい JSON に変換されたオブジェクトのリストがあります。

このコードは機能しません

@{

    var suburbs = Html.Raw(Json.Encode(Model.Suburbs));

    <script>

    $(function () {

        var data = '@suburbs';

        $("#sSuburb").kendoAutoComplete({
                dataSource: data,
                filter: "startswith",
                placeholder: "Select suburb...",
                dataTextField: "SuburbName",
                dataValueField: "ID",
                separator: ", "
            });
     });
    <script>
}

しかし、どうしてこれが機能するのですか

 var data = [{ "ID": 1, "SuburbName": "NEWSTEAD", "PostCode": "4006", "State": "QLD", "CountryCode": 1 }, { "ID": 2, "SuburbName": "NEWSTEADS", "PostCode": "4006", "State": "QLD", "CountryCode": 1 }, { "ID": 4, "SuburbName": "NEWS", "PostCode": "4006", "State": "QLD", "CountryCode": 1 }, { "ID": 5, "SuburbName": "NEWSTEST", "PostCode": "4006", "State": "QLD", "CountryCode": 1 },];

  $("#sSuburb").kendoAutoComplete({
                dataSource: data,
                filter: "startswith",
                placeholder: "Select suburb...",
                dataTextField: "SuburbName",
                dataValueField: "ID",
                separator: ", "
            });

言うまでもなく、JSON の結果は両方の例で同じです。私がここに欠けているものはありますか?

アップデート:

JSON.Stringify も試しましたが、まだうまくいきません

    var data = JSON.stringify(@suburbs);

これは、alert(data); を使用したときの実際の json の結果です。

[{"ID":1,"SuburbName":"NEWSTEAD","PostCode":"4006","State":"QLD","CountryCode":1},{"ID":2,"SuburbName":"NEWSTEADS","PostCode":"4006","State":"QLD","CountryCode":1},{"ID":4,"SuburbName":"NEWS","PostCode":"4006","State":"QLD","CountryCode":1},{"ID":5,"SuburbName":"NEWSTEST","PostCode":"4006","State":"QLD","CountryCode":1},{"ID":6,"SuburbName":"NETWORK","PostCode":"9006","State":"QLD","CountryCode":1},{"ID":7,"SuburbName":"NEW JERS","PostCode":"9006","State":"QLD","CountryCode":1},{"ID":8,"SuburbName":"SYDNEY","PostCode":"2001","State":"NSW","CountryCode":1},{"ID":9,"SuburbName":"SYDNEYHAM","PostCode":"2001","State":"NSW","CountryCode":1},{"ID":10,"SuburbName":"SYD","PostCode":"2001","State":"NSW","CountryCode":1},{"ID":11,"SuburbName":"SYRACUSE","PostCode":"2001","State":"NSW","CountryCode":1},{"ID":12,"SuburbName":"SYDTEST","PostCode":"9001","State":"NSW","CountryCode":1},{"ID":13,"SuburbName":"SYDDD","PostCode":"9001","State":"NSW","CountryCode":1}]

ハードコードされたものと明らかに同じです。

しかし、firebugで表示dataし、最初の例の変数をWATCHすると、通常の文字列と同じように扱われたようです

"[{"ID":1,"SuburbName":"NEWSTEAD","PostCode":"4006","State":"QLD","CountryCode":1},{"ID":2,"SuburbName":"NEWSTEADS","PostCode":"4006","State":"QLD","CountryCode":1}....

2 番目の例では、firebug の時計が表示されます。

[Object { ID=1, SuburbName="NEWSTEAD", PostCode="4006", more...}, Object { ID=2, SuburbName="NEWSTEADS".......

Object2枚目に注目。※2枚目は大丈夫です。

4

2 に答える 2

2

問題は次のステートメントにあります。

var data = '@suburbs';

dataSource「データ」変数は、オプションの有効な設定ではない文字列です。var data = @suburbs;文字列ではなく JavaScript 配列が本当に必要なため、試すことができます。

于 2013-06-25T06:44:55.177 に答える
2

Kendo データソースを使用して、サーバーからデータを読み取ります。

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {            
            url: serverMethodURL,  // the remote service url
            dataType: "jsonp",     // JSONP is required for cross-domain AJAX

            // additional parameters sent to the remote service
            data: {
                q: "html5"
            }
        }
    },
    // describe the result format
    schema: {
        // the data which the data source will be bound to is in the "results" field
        data: "results"
    }
});

次に、それをオートコンプリートにバインドします(デモのように)

$("#sSuburb").kendoAutoComplete({
      dataSource: dataSource,....
于 2013-06-25T05:40:22.153 に答える