剣道グリッドの親グリッド行のchceckboxをクリックして子グリッドデータを取得する

剣道を初めて使う人です。親グリッド行のチェックボックスをクリックして、子グリッドのデータを取得するにはどうすればよいですか。私は親グリッドレコードのチェックボックスがそのグリッドの子グリッドレコードをチェックしているかどうかを確認したい。剣道グリッドの親グリッド行のchceckboxをクリックして子グリッドデータを取得する

image about the grid[parent]and child grid[which shows the deatil record]

はあなたのチェックボックスonClickイベントハンドラに追加ここ

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

    <script src="//kendo.cdn.telerik.com/2016.3.1118/js/jquery.min.js"></script> 
    <script src="//kendo.cdn.telerik.com/2016.3.1118/js/kendo.all.min.js"></script> 
</head> 
<body> 

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

      <script> 
       $(document).ready(function() { 
        var element = $("#grid").kendoGrid({ 
         dataSource: { 
          type: "odata", 
          transport: { 
           read: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Employees" 
          }, 
          pageSize: 6, 
          serverPaging: true, 
          serverSorting: true 
         }, 
         height: 600, 
         sortable: true, 
         pageable: true, 
         detailInit: detailInit, 
         dataBound: function() { 
          this.expandRow(this.tbody.find("tr.k-master-row").first()); 
         }, 
         columns: [{ template: "<input type='checkbox' class='checkbox' />", width:40}, 
          { 
           field: "FirstName", 
           title: "First Name", 
           width: "110px" 
          }, 
          { 
           field: "LastName", 
           title: "Last Name", 
           width: "110px" 
          }, 
          { 
           field: "Country", 
           width: "110px" 
          }, 
          { 
           field: "City", 
           width: "110px" 
          }, 
          { 
           field: "Title" 
          } 
         ] 
        }); 
       }); 

       function detailInit(e) { 
        $("<div/>").appendTo(e.detailCell).kendoGrid({ 
         dataSource: { 
          type: "odata", 
          transport: { 
           read: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Orders" 
          }, 
          serverPaging: true, 
          serverSorting: true, 
          serverFiltering: true, 
          pageSize: 10, 
          filter: { field: "EmployeeID", operator: "eq", value: e.data.EmployeeID } 
         }, 
         scrollable: false, 
         sortable: true, 
         pageable: true, 
         columns: [ 
          { field: "OrderID", width: "110px" }, 
          { field: "ShipCountry", title:"Ship Country", width: "110px" }, 
          { field: "ShipAddress", title:"Ship Address" }, 
          { field: "ShipName", title: "Ship Name", width: "300px" } 
         ] 
        }); 
       } 
      </script> 
     </div> 


</body> 
</html>

出典

2016-12-10 Dalvi

画像の説明を入力します。

click: function(e) { 
     var childGrid = this.element.closest("[data-role=grid]").getKendoGrid(); 
     //and here is data 
     var data = childGrid.datasource.data(); 
    }

出典

2016-12-10 20:43:50

剣道グリッドの親グリッド行のchceckboxをクリックして子グリッドデータを取得する

答えて

関連する問題