kendo.ui.Grid绑定单双击事件

最新推荐文章于 2025-06-10 09:34:02 发布

原创最新推荐文章于 2025-06-10 09:34:02 发布 · 6.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#kendoUI #Grid #事件绑定

本文介绍如何使用 KendoGrid 创建一个具备基本功能的数据表格，包括分页、筛选、排序等，并展示了如何设置表格列标题及响应点击和双击事件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div id="grid"></div>
<script>
var grid = $("#grid").kendoGrid({
columns: [
{ field: "id" },
{ field: "name" }
],
dataSource: [
{ id: "1", name: "lili" },
{ id: "2", name: "jim" },
{ id: "3", name: "jone" },
{ id: "4", name: "tom" }
],
filterable: true,
sortable: true,
navigatable: true,
selectable: "multiple",
pageable: {
pageSize: 10,
refresh: true
},
columns: [
{ field: "id", title: "账号" },
{ field: "name", title: "姓名" }
],
});
grid.on('dblclick', '.k-grid-content tr', function () {
// 双击
var row = grid.data("kendoGrid").select();
var data = grid.data("kendoGrid").dataItem(row);
var id = data.id;
alert('双击事件【id：' + id + '】');
});
grid.on('click', '.k-grid-content tr', function () {
// 双击
var row = grid.data("kendoGrid").select();
var data = grid.data("kendoGrid").dataItem(row);
var name = data.name;
alert('单击事件【name：' + name + '】');
});
</script>