选择方法不选择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行

回答

相关问题