Kendo UI Grid Basic實現

Question

我正在嘗試實現Grid的基本功能，因為在編譯我的項目時出現了一個錯誤，提示“期望的對象”

使用以下代碼行：

         $(document).ready(function() {
                $("#grid").kendoGrid({
                    dataSource: {
                        data: createRandomData(50),  //exception in this line of code
                        pageSize: 10
                    },

您能幫助我了解我需要代替createRandomData編寫什么內容嗎？ 是我從中獲取數據以將其放置在Grid上的表名還是其他名稱？ （順便說一句，我使用的是SQL Server 2008作為后端，並在Visual Studio 2010 MVC4上運行此代碼），我也是MVC和Kendo UI的新手。

我正在嘗試實現的是使用MVC 4將數據從SQL Server綁定到網格。

提前致謝！ :)

這是代碼：

              <script>
            $(document).ready(function () {
                $("#grid").kendoGrid({
                    dataSource: {
                        data: createRandomData(50),
                        pageSize: 10
                    },
                    groupable: true,
                    sortable: true,
                    pageable: {
                        refresh: true,
                        pageSizes: true
                    },
                    columns: [{
                        field: "FirstName",
                        width: 90,
                        title: "First Name"
                    }, {
                        field: "LastName",
                        width: 90,
                        title: "Last Name"
                    }, {
                        width: 100,
                        field: "City"
                    }, {
                        field: "Title"
                    }, {
                        field: "BirthDate",
                        title: "Birth Date",
                        template: '#= kendo.toString(BirthDate,"dd MMMM yyyy") #'
                    }, {
                        width: 50,
                        field: "Age"
                    }
                    ]
                });
            });
        </script>

這是函數定義：

    function createRandomData(count) {
       var data = [],
      now = new Date();
       for (var i = 0; i < count; i++) {
        var firstName = firstNames[Math.floor(Math.random() * firstNames.length)],
        lastName = lastNames[Math.floor(Math.random() * lastNames.length)],
        city = cities[Math.floor(Math.random() * cities.length)],
        title = titles[Math.floor(Math.random() * titles.length)],
        birthDate = birthDates[Math.floor(Math.random() * birthDates.length)],
        age = now.getFullYear() - birthDate.getFullYear();

    data.push({
        Id: i + 1,
        FirstName: firstName,
        LastName: lastName,
        City: city,
        Title: title,
        BirthDate: birthDate,
        Age: age
    });
}
return data;

}

控制器應該返回作為計數傳遞的值嗎？

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

Answer 1

文檔中有很多針對ASP.NET的教程。 我建議從此開始。 如果您還不熟悉從服務器返回JSON，還可以從本教程開始使用服務 。

Answer 2

函數createRandomData（50）應該返回一個json對象。 請同時顯示函數定義。

您返回的網格和json對象中的列名不匹配

Answer 3

在服務器端，定義具有必要屬性的類型。 然后使用數據庫中的服務器端代碼或一些隨機數據填充對象數組。 從控制器使用內置的JavaScript序列化器將數組序列化為JSON並作為JsonResult返回。 例如，

公共JsonResult CreateRandomData（int count）{

列出人員=

返回新的JsonResult（）{數據=人員，ContentType =“ application / json”，JsonRequestBehavior = JsonRequestBehavior.AllowGet};

}

內置的JsonSerializer（System.Web.Mvc）提供JSON序列化和反序列化支持。