選擇方法不選擇Kendo UI Grid行

我似乎無法得到選擇kendo UI網格（網絡）方法來選擇一行（或任何事情）。我在另一篇文章中讀到了將div ID包含在選擇器中，但這也沒有幫助。爲簡單起見，我試圖做到這一點在telerick的例子在這裏：http://dojo.telerik.com/oNeR 選擇方法不選擇Kendo UI Grid行

我會想到的是，第一行會自動選擇加入：

  var gridRow = $("#rowSelection").data("kendoGrid"); 
      gridRow.select("tr:eq(0)");

完整的例子：

<html> 
<head> 
<base href="http://demos.telerik.com/kendo-ui/grid/selection"> 
<style>html { font-size: 12px; font-family: Arial, Helvetica, sans-serif; }</style> 
<title></title> 
<link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.common.min.css"  rel="stylesheet" /> 
<link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.default.min.css" rel="stylesheet" /> 
<link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.dataviz.min.css" rel="stylesheet" /> 
<link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.dataviz.default.min.css" rel="stylesheet" /> 
<script src="http://cdn.kendostatic.com/2014.2.903/js/jquery.min.js"></script> 
<script src="http://cdn.kendostatic.com/2014.2.903/js/angular.min.js"></script> 
<script src="http://cdn.kendostatic.com/2014.2.903/js/kendo.all.min.js"></script> 
</head> 
<body> 
     <script src="../content/shared/js/orders.js"></script> 

    <div id="example"> 

     <div class="demo-section k-header"> 
      <h4>Grid with multiple row selection enabled</h4> 
      <div id="rowSelection"></div> 
     </div> 

     <div class="demo-section k-header"> 
      <h4>Grid with multiple cell selection enabled</h4> 
      <div id="cellSelection"></div> 
     </div> 

     <script> 
      $(document).ready(function() { 
       $("#rowSelection").kendoGrid({ 
        dataSource: { 
         data: orders, 
         pageSize: 6 
        }, 
        selectable: "single", 
        pageable: { 
         buttonCount: 5 
        }, 
        scrollable: false, 
        navigatable: true, 
        columns: [ 
         { 
          field: "ShipCountry", 
          title: "Ship Country", 
          width: 300 
         }, 
         { 
          field: "Freight", 
          width: 300 
         }, 
         { 
          field: "OrderDate", 
          title: "Order Date", 
          format: "{0:dd/MM/yyyy}" 
         } 
        ] 
       }); 

       $("#cellSelection").kendoGrid({ 
        dataSource: { 
         data: orders, 
         pageSize: 6 
        }, 
        selectable: "multiple cell", 
        pageable: { 
         buttonCount: 5 
        }, 
        scrollable: false, 
        navigatable: true, 
        columns: [ 
         { 
          field: "ShipCountry", 
          title: "Ship Country", 
          width: 300 
         }, 
         { 
          field: "Freight", 
          width: 300 
         }, 
         { 
          field: "OrderDate", 
          title: "Order Date", 
          format: "{0:dd/MM/yyyy}" 
         } 
        ] 
       }); 
      }); 
      var gridRow = $("#rowSelection").data("kendoGrid"); 
      gridRow.select("tr:eq(0)"); 
     </script> 
    </div> 


</body> 
</html>

來源

2014-09-05 user1489995

在乍一看，電網代碼是正確的。我幾乎可以肯定你的問題是你的腳本在它被初始化之前正在執行和調用網格上的方法 - 當然它還沒有被綁定。在第一種情況下，我期望在控制檯中看到錯誤，因爲gridRow會被定義，在第二種情況下，由於選擇器tr：eq（0）不會匹配任何東西，所以我希望它會默默失敗。

嘗試連接到電網的databound event功能如下 -

<script> 
    $(document).ready(function() { 
     function selectFirstRow(event) { 
      event.sender.select("tr:eq(0)"); 
     } 

     $("#rowSelection").kendoGrid({ 
      dataBound: selectFirstRow, 
      dataSource: { 
       data: orders, 
       pageSize: 6 
      }, 
      selectable: "single", 
      pageable: { 
       buttonCount: 5 
      }, 
      scrollable: false, 
      navigatable: true, 
      columns: [ 
       { 
        field: "ShipCountry", 
        title: "Ship Country", 
        width: 300 
       }, 
       { 
        field: "Freight", 
        width: 300 
       }, 
       { 
        field: "OrderDate", 
        title: "Order Date", 
        format: "{0:dd/MM/yyyy}" 
       } 
      ] 
     }); 

     $("#cellSelection").kendoGrid({ 
      dataSource: { 
       data: orders, 
       pageSize: 6 
      }, 
      selectable: "multiple cell", 
      pageable: { 
       buttonCount: 5 
      }, 
      scrollable: false, 
      navigatable: true, 
      columns: [ 
       { 
        field: "ShipCountry", 
        title: "Ship Country", 
        width: 300 
       }, 
       { 
        field: "Freight", 
        width: 300 
       }, 
       { 
        field: "OrderDate", 
        title: "Order Date", 
        format: "{0:dd/MM/yyyy}" 
       } 
      ] 
     }); 
    }); 
</script>

來源

2014-09-05 21:10:26 pwdst

閱讀有關數據綁定我認爲作品。但是，事實並非如此。它引發TypeError：'undefined'在執行select方法時不是一個對象（評估'o.options'）。也不能在Kendo dojo測試應用程序中使用。 – user1489995 2014-09-08 12:44:50

@ user1489995我已經在http://dojo.telerik.com/EKOm上修復了您的Dojo - 您需要稍微不同地聲明您的數據源。你能否在你的問題中包含orders.js（不必使用真實數據）。它是一個對象數組嗎？ – pwdst 2014-09-08 21:52:13

選擇方法不選擇Kendo UI Grid行

回答

相關問題