1

ビューにjQueryとKendoUIを使用しているMVC3 ASP.NETプロジェクトがあります。コンボボックスとそのためのデータソースを定義しました。データソース内の正しい形式の JSON 文字列を使用してコントローラーから結果を取得しています。

JSON 文字列として返されるデータは約 500kb で、コンボボックスには何も表示されません。右側に読み込みアイコンが表示されるだけです。大量のデータは本当にここで問題だと思います...

誰でも助けることができますか？

ベローは私のコードのスニペットです：

<input id="kendoCboClienti" />

<script type="text/javascript">
    $(document).ready(function () {
        clientiDS = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "/Clienti/",
                    dataType: "json"
                }
            },
            schema: {
                model: {
                    fields: {
                        id: { type: "string" },
                        ragioneSociale: { type: "string" }
                    }
                }
            }
        });

        $("#kendoCboClienti").kendoComboBox({
            placeholder: "Sceglie il cliente",
            dataTextField: "RAGIONE_SOCIALE",
            dataValueField: "ID",
            dataSource: clientiDS
        });
    });
</script>

JSON 文字列は次のようになります。

[  
    {ID:429,RAGIONE_SOCIALE:"AUTOTRASP.PORETTO G."},
    {ID:430,RAGIONE_SOCIALE:"P.G. JOHNNY IMPORT EXPORT"},
    {ID:431,RAGIONE_SOCIALE:"CONFARTIGIANATO TREVISO"},
    .....    
]

jsFiddle では動作しますが、非常に遅く、応答がなく、その量のデータに対してブラウザーがクラッシュすることがあります。

ありがとう！

編集 1: dataSource に送信されるデータの量 (10 レコードのみ) を変更しましたが、まだ機能しません。多分それはデータソースに問題がありますか？

4

3 に答える 3

2

データソースの URL は正しいですか? mvc を使用している場合、url は /controller/view/ である必要があります。すなわち:url: "/Home/Clienti/"

- 編集 -

プロジェクト URL の完全な例を次に示します: 'http://localhost:52794/Home/ComboBox'

コントローラー: ホーム

表示: コンボボックス

ComboBox ビュー コード:

<input id="kendoCboClient" />

<script type="text/javascript">
    $(document).ready(function () {
        clientDS = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "/Home/JsonData/",  //Note the URL path!
                    dataType: "json"
                }
            },
            schema: {
                model: {
                    fields: {
                        EmployeeId: { type: "number" },
                        name: { type: "string" }
                    }
                }
            }
        });

        $("#kendoCboClient").kendoComboBox({
            placeholder: "Select a name...",
            dataTextField: "Name",
            dataValueField: "EmployeeId",
            dataSource: clientDS
        });
    });
</script>

モデルクラス:

public class Employee
{
    public int EmployeeId { get; set; }
    public string Name { get; set; }
}

コントローラー:

public ActionResult ComboBox()
{
    return View();
}

public JsonResult JsonData()
{
    List<Employee> list = new List<Employee>();
    Employee employee = new Employee() { EmployeeId = 1, Name = "John Smith" };
    list.Add(employee);
    employee = new Employee() { EmployeeId = 2, Name = "Ted Teller" };
    list.Add(employee);
    return Json(list, JsonRequestBehavior.AllowGet);
}

- 編集 -

json を返す別の方法:

public ActionResult JsonData()
{
    List<Employee> list = new List<Employee>();
    Employee employee = new Employee() { EmployeeId = 1, Name = "John Smith" };
    list.Add(employee);
    employee = new Employee() { EmployeeId = 2, Name = "Ted Teller" };
    list.Add(employee);

    JavaScriptSerializer serializer = new JavaScriptSerializer();
    var output = serializer.Serialize(list);

    return Content(output); 
}

- 編集 -

単純な json 文字列の最後の例:

public ActionResult JsonData()
{
    String employeesJson = "[{\"EmployeeId\":1,\"Name\":\"John Smith\"},{\"EmployeeId\":2,\"Name\":\"Ted Teller\"}]";
    return Content(employeesJson);
}
于 2012-06-13T14:29:02.837 に答える
1

はい、問題はコントローラーから送信していた JSON 形式にありました。サードパーティの Web サービス ( ServiceStackに基づく) を使用しています。コントローラーで、Web 応答を文字列 (JSON 文字列) で「読み取り」、さらにそれを渡しました。問題は、返された JSON 文字列が " " の間にあり、どういうわけか dataSource がそれを処理できないことでした。

したがって、私の解決策は上記の例に基づいていました。モデル、コレクションを作成し、コレクションを返しました。

結果: すべてが完璧に機能しました。返された JSON は " " の間ではなくなり、dataSource オブジェクトは適切に初期化されました。

コードは次のとおりです。

ClientiController.cs

public class ClientiController : Controller
{            
        public JsonResult Index()
        {
            StreamReader sr = null;
            string json = string.Empty;

            try
            {
                WebRequest request = WebRequest.Create("urlGoesHere");

                using (WebResponse response = request.GetResponse())
                {
                    sr = new StreamReader(response.GetResponseStream(), true);
                    json = sr.ReadToEnd();
                }
            }
            catch { return Json("", JsonRequestBehavior.AllowGet); }

            JavaScriptSerializer serializer = new JavaScriptSerializer();
            ClientiCollection collection = serializer.Deserialize<ClientiCollection>(json);

            return Json(collection, JsonRequestBehavior.AllowGet);
        }

}

Client.cs

public class Client
{
        public string ID { get; set; }
        public string RAGIONE_SOCIALE { get; set; }
}

ClientiCollection.cs

public class ClientiCollection
{
        public IEnumerable<Client> ClientiList { get; set; }
}

HTML

<input id="kendoCboClienti" />

<script type="text/javascript">
    $(document).ready(function () {
        var clientiDataSource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "/Clienti/",
                    dataType: "json"
                }
            },
            schema: {
                data: "ClientiList"
            }
        });

        $("#kendoCboClienti").kendoComboBox({
            dataTextField: "RAGIONE_SOCIALE",
            dataValueField: "ID",
            dataSource: clientiDataSource,
        });
    });
</script>

ただし、表示するレコードが最大 8000 あり、コンボボックスが少し遅くなります (開くと約 1.5 秒)。サーバーをまったく変更せずに、どうにかして応答を改善できるかどうかはわかりません。

PSどうもありがとう、イゴリアス！

于 2012-06-15T10:52:01.397 に答える