用數據源綁定Kendo網格不顯示數據

我想用以下參考學習Kendo網格。用數據源綁定Kendo網格不顯示數據

我有一個名爲「localDataSource」的數據源。網格需要顯示來自這個源的數據。我嘗試在kendoGrid定義中定義dataSource: localDataSource。然後我試着明確地設置了數據源grid.setDataSource(localDataSource);

儘管沒有javascript錯誤，但這兩種方法都沒有渲染數據。這裏缺少什麼？

Fiddle

CODE

<head> 
    <title>Grid with DataSource</title> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.all.min.js"></script> 


    <style type="text/css"> 
     table, th, td 
     { 
      border: 1px solid black; 
     } 
    </style> 

</head> 
<body> 


     <div id="example" class="k-content"> 

      <div id="grid"> 
      AAAA 
      </div> 

      <script> 
       $(document).ready(function() { 

        var products = [ 
          { title: "Nylon", year: 1977 }, 
          { title: "Fabric Material", year: 1980 }, 
          { title: "Yards UOM", year: 1983 } 
          ]; 

        var localDataSource = new kendo.data.DataSource({ data: products }); 

        //console.log(localDataSource); 

        $("#grid").kendoGrid({ 
         dataSource: localDataSource, 
         height: 430, 
         columns: [ 
            { field: "Title", title: "Title", format: "{0:c}", width: "130px" }, 
            { field: "Year", title: "Year", width: "130px" } 
           ] 
        }); 

        var grid = $('#grid').data("kendoGrid"); 
        grid.setDataSource(localDataSource); 
       }); 
      </script> 

     </div> 


</body>

來源

2014-03-03 Lijo

Kendo Grid - jsFiddle得到了良好的示例代碼此-exactly什麼，我一直在尋找。

以下兩種方法的工作原理

var products = [ 
          { FirstName: "Nylon", LastName: 1977 }, 
          { FirstName: "Yards", LastName: 1983 } 
          ]; 

var localDataSource = new kendo.data.DataSource({ data: products })

方法1

  $("#grid").kendoGrid({ 
        dataSource: localDataSource, 
        columns: [ 
         { field: "FirstName", title: "FirstName" }, 
         { field: "LastName", title: "LastName" } 
          ] 
        });

方法2

var grid = $("#grid").kendoGrid({ 
    dataSource: localDataSource, 
    columns: [ 
     {field: "FirstName", title: "First Name"}, 
     {field: "LastName",title: "Last Name"} 
      ]  
}).data("kendoGrid");

fiddle 1和fiddle 2

來源

2014-03-03 17:34:39 Lijo

您有列錯誤的定義。字段選項區分大小寫，您使用大寫字母而不是低字母。

columns: [ 
     { field: "title", title: "Title", format: "{0:c}", width: "130px" }, 
     { field: "year", title: "Year", width: "130px" } 
]

Fiddle

來源

2014-03-03 17:22:36

用數據源綁定Kendo網格不顯示數據

回答

相關問題