我有一个Kendo Grid,如下所示。每个父行中都有一个复选框。单击按钮,我需要获取所有父行的子网格,并选中该复选框。我们怎么能这样做?
按钮移动
$('#btnMove').click(function ()
{
var parentgrid = $('#sampleGrid').data('kendoGrid');
var childGrid = $('#sampleGrid').closest(".k-grid").data("kendoGrid");
var Count = $('#sampleGrid').data("kendoGrid").dataSource.total();
alert(Count);
$(".chk").each(function ()
{
debugger;
var tr= $(this).closest("tr");
var itemParentRow = parentgrid.dataItem(tr);
//var childGrid = $(this).closest(".k-grid").data("kendoGrid");
});
});
父网格
$("#sampleGrid").kendoGrid({
dataSource: {
//type: "json",
type: "aspnetmvc-ajax",
transport: {
read: "Home/GetCostPageData",
dataType: "json"
//,type: "POST"
},
schema: {
model: {
fields: {
Program: {
type: "string",
//this field will not be editable (default value is true)
editable: false
},
Group: { type: "string" },
Sequence: { type: "string" }
}
},
total: "Total",
data: "CostPages"
},
pageSize: 25,
serverPaging: true,
serverFiltering: true,
serverSorting: true,
serverGrouping: true,
requestStart: function (e) {
Logger.logMessage("request started");
},
requestEnd: function (e) {
Logger.logMessage("request ended");
},
change: function (e) {
var data = this.data();
},
error: function (e) {
alert("error");
}
},
detailInit: detailInit,
dataBound: function ()
{
//this.expandRow(this.tbody.find("tr.k-master-row").first());
},
height: 500,
filterable: true,
sortable: true,
pageable: true,
groupable: true,
columns: [
{
field: "Recon",
title: "Select",
"template": "<input class='chk' type=\"checkbox\" />",
width: 25
},
{
field: "Program",
title: "Program",
width: 100
},
{
field: "Group",
title: "Group",
width: 100
},
{
field: "Sequence",
title: "Sequence",
width: 100
},
{
field: "Description",
title: "Description",
width: 100
}
],
editable:
{
mode: "inline"
//inline/incell/popup
},
toolbar: ["create"],
edit: function (e) {
if (!e.model.isNew()) {
// Disable the editor of the "id" column when editing data items
var numeric = e.container.find("input[name=id]").data("kendoNumericTextBox");
numeric.enable(false);
}
},
cancel: function (e) {
e.preventDefault();
}
});
儿童网格
function detailInit(e) {
var myPerson = {};;
myPerson.FirstName = "A";
myPerson.LastName = "B";
var id = e.data.uid;
$("<div id =" + id + "/>").appendTo(e.detailCell).kendoGrid({
dataSource: {
type: "aspnetmvc-ajax",
transport: {
dataType: "json",
//type: "POST",
read: {
url: "Home/GetItemsData",
data: function () {
return myPerson;
}
}
},
schema: {
model: {
fields: {
Program: {
ItemID: "number",
},
ItemDescription: { type: "string" }
}
},
total: "Total",
data: "Items"
},
serverPaging: true,
serverSorting: true,
serverFiltering: true,
pageSize: 5
},
scrollable: false,
sortable: true,
pageable: true,
columns: [
{ field: "ItemID", title: "Item Id", width: "70px" },
{ field: "ItemDescription", title: "Item Description", width: "110px" }
]
});
}
答案 0 :(得分:1)
如果您有多个网格正在生成相同的按钮动作,则下面将为您提供相应按钮的网格ID。
$(".k-grid-add-new").bind('click', function () {
var strGridID = this.closest('div.k-grid').id;
}
答案 1 :(得分:0)
在我的代码中,checkbox
中的header
不在td
,但这有助于您找到相应的child grid
checkbox
,
<script type="text/javascript">
$(document).ready(function () {
$('#Submit1').click(function () {
var grid = $("#grid12").data("kendoGrid");
var selected = grid.tbody.find('td').find('.chkbxq').is(':checked');
var checkid = grid.tbody.find('td').find('.chkbxq').attr('id');
var cellIndex = grid.tbody.find('td').find('.chkbxq:checked').parent().index();
var rowIndex = grid.tbody.find('td').find('.chkbxq:checked').parent().parent().index();
if (selected == true) {
$('.k-detail-row').find('td.k-detail-cell').find('div.k-grid').find('table').find('tbody').find('td').find('[type="checkbox"]').attr('checked', 'checked');
}
});
});
</script>