kendoui grid，當autoBind config設置爲false時綁定數據

我正在使用其中autoBind config設置爲false的kendoui網格。我想通過單擊按鈕來綁定數據。我不想使用datasource.read（），因爲它會增加服務器端調用。我已經有了我想要綁定到網格的數據。kendoui grid，當autoBind config設置爲false時綁定數據

更多信息，請參見fiddle

<!DOCTYPE html> 
<html> 
<head> 
    <base href="http://demos.telerik.com/kendo-ui/grid/local-data-binding"> 
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style> 
    <title></title> 
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.1.112/styles/kendo.common-material.min.css" /> 
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.1.112/styles/kendo.material.min.css" /> 

    <script src="//kendo.cdn.telerik.com/2016.1.112/js/jquery.min.js"></script> 
    <script src="//kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script> 
</head> 
<body> 
     <script src="../content/shared/js/products.js"></script> 

     <div id="example"> 
      <div id="buttonGrid" style="height:100px;width:100px">Click me</div> 

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

      <script> 
       $(document).ready(function() { 
        $("#grid").kendoGrid({ 
         dataSource: { 
          //data: products, 
          schema: { 
           model: { 
            fields: { 
             ProductName: { type: "string" }, 
             UnitPrice: { type: "number" }, 
             UnitsInStock: { type: "number" }, 
             Discontinued: { type: "boolean" } 
            } 
           } 
          }, 
          pageSize: 20 
         }, 
         height: 550, 
         scrollable: true, 
         sortable: true, 
         filterable: true, 
         autoBind: false, 
         pageable: { 
          input: true, 
          numeric: false 
         }, 
         columns: [ 
          "ProductName", 
          { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "130px" }, 
          { field: "UnitsInStock", title: "Units In Stock", width: "130px" }, 
          { field: "Discontinued", width: "130px" } 
         ] 
        }); 
       }); 

       $("#buttonGrid").click(function(){ 
          //How to bind the data available as products 

       }); 

      </script> 
</div> 


</body> 
</html>

來源

2016-02-23 OpenStack

使用data()代替：

$("#buttonGrid").click(function(){ 
    //How to bind the data available as products 
    $("#grid").data("kendoGrid").dataSource.data([ 
     { ProductName: "Test1", UnitPrice: 1, UnitsInStock: 1, Discontinued: false } 
    ]); 
});

Demo

來源

2016-02-23 14:33:12 DontVoteMeDown

謝謝你的快速回復。這是我想要的。但我遇到了另一個問題。我的網格也使用分頁，我怎樣才能將「總行數」與數據一起傳遞？ – OpenStack

@OpenStack不'grid.dataSource.data（）。length'返回總數？ – DontVoteMeDown

我想「設置」全部屬性。所以基本上我試圖加載網格點擊一個按鈕。當我得到迴應時，我得到'data'＆'totalRowCount'。我可以在你的幫助下設置數據。如何設置將正確設置分頁工具欄的totalRowCount。 – OpenStack

kendoui grid，當autoBind config設置爲false時綁定數據

回答

相關問題