在剑道网格中添加未绑定的复选框列
本文关键字:绑定 复选框 添加 网格 | 更新日期: 2023-09-27 18:10:19
我尝试在我的剑道网格中添加一个复选框列。我使用这个链接中的代码:
http://www.telerik.com/support/code-library/select-grid-rows-using-checkboxes-and-preserve-it-between-the-pages但是它不能用剃刀页。下面是我的代码:
cshtml:
@(Html.Kendo().Grid<IQuestArchive>().Name("archivesGrid")
.DataSource(dataSource => dataSource.Ajax().Read(read => read.Action("Archives_Read", "Home").Type(HttpVerbs.Get))
.Sort(sort => sort.Add("Name").Ascending())).Columns(columns =>
{
columns.Template(@<text></text>).ClientTemplate("<input type='checkbox' class='checkbox'/>").Title("<input type='checkbox'/>").Width(10);
columns.Bound(request => request.ReadableName).Title("Name");
}).Sortable().Selectable(builder => builder.Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row)))
脚本:
//bind click event to the checkbox
$("#archivesGrid").table.on("click", ".checkbox" , selectRow);
//on click of the checkbox:
function selectRow() {
var checked = this.checked,
row = $(this).closest("tr"),
grid = $("#archivesGrid").data("kendoGrid"),
dataItem = grid.dataItem(row);
checkedIds[dataItem.id] = checked;
if (checked) {
//-select the row
row.addClass("k-state-selected");
} else {
//-remove selection
row.removeClass("k-state-selected");
}
}
我不明白是什么出了问题,如果我与链接之前的代码进行比较,它是完全相同的逻辑…:s
你需要仔细看看;我可以告诉你一个区别;你做
$("#archivesGrid").table.on("click", ".checkbox" , selectRow);
而demo则是
var grid = $("#grid").kendoGrid({
//...
}).data("kendoGrid");
//bind click event to the checkbox
grid.table.on("click", ".checkbox" , selectRow);
理解代码在做什么是很重要的,这样你才能调试它。JQuery元素没有table属性。它是Kendo UI网格小部件的一个属性。