<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.mobile.all.min.css"/>
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script>
</head>
<body>
<div id="grid"></div>
<script>
var uid="";
$("#grid").kendoGrid({
editable: "popup",
columns: [
{ field: "name" },
{ field: "age" }
,
{ command: "edit" }
],
dataSource: {
data: [
{ id: 1, name: "Jane Doe", age: 30 },
{ id: 2, name: "Jane Doe", age: 30 },
{ id: 3, name: "Jane Doe", age: 30 },
{ id: 4, name: "Jane Doe", age: 30 },
{ id: 5, name: "John Doe", age: 33 }
],
schema: {
model: {
id: "id",
fields: {
"id": { type: "number" }
}
}
}
},
selectable: "row",
edit: function(e) {
if (!e.model.isNew()) {
console.log("1",e.model.uid);
uid=e.model.uid;
var grid = $("#grid").data("kendoGrid");
grid.select("tr[data-uid='" + uid + "']");
}
},
save: function(e) {
},
dataBound:function(e){
console.log("2",uid);
var grid = $("#grid").data("kendoGrid");
//var uid = grid.dataSource.at(1).uid;
grid.select("tr[data-uid='" + uid + "']");
},
select:function(e){
console.log("test",e);
}
});
相关推荐
应用kendoui grid实现的多级分组表格展现,里面包含了表格的分组统计以及单表合计功能、还有针对表格的刷新以及子表格刷新功能。此功能是在原有demo版本上改进,增加了很多的个别需求实现,在原来的版本是做不到的。...
该代码类里面实现的主要操作: 1.ajax 访问后代接口,并将结果返回值绑定到kendo ui 的grid上。 2. 实现复杂的kendo ui 的grid的表头设置,这个是本人亲自写的,并且经过验证是正确的
griddatepickercustomfiltering,动态设置显示kendoui grid控件某一列的格式
Kendo UI框架提供了强大的Excel导出功能,通过Grid的saveAsExcel能方便地导出Grid中的数据,而且格式美观大方,使用起来也非常方便。但是在实际使用中不是很理想,主要有以下两个问题: 1. 导出的列数据是原始值 ...
标准kendo ui-grid控件用法,文档形式。
Kendo UI ,在ASP.NET MVC 4中使用Kendo UI Grid
Kendo UI Grid为开发者提供了100多种丰富的网格功能,从基本的筛选、排序,到高级的编页、分层数据分组等等。毫不夸张的说,Kendo UI Grid是同类产品中数一数二的佼佼者。耳听为虚眼见为实,下面我为大家整理了它的...
Kendo UI是一个强大的框架用于快速HTML5 UI开发。基于最新的HTML5、CSS3和JavaScript标准。今天小编通过分享本文给大家介绍Kendo Grid editing 自定义验证报错提示的解决方法
这两天项目需要,临时做了一个,没有封装,该grid可以实现列和行的自定义添加和删除,包括修改标题,以及列的右击添加事件。希望对你们有所帮助!双击列名可以对列名进行修改,右键列名可以选择左侧和右侧添加列以及...
前台kendo ui js grid 的增删改查,js部分。包括分页查询,服务及异常和激活
剑道网格卷轴 kendo-ui 库的程序网格... kendoGrid ( { dataSource : { data : data , pageSize : 20 } , ... //init var kendoGridScroll = new KendoGridScroll . Model ( $ ( "#grid" ) , function ( gri
Kendo UI编辑框 增删改查 编辑框内有图片或文件上传功能,功能高大上。
一个演示是可在Github上页网页的剑道并网编辑。 基本用法 // create grid var grid = $grid . kendoGrid ( { dataSource : dataSource , columns : [ { //column settings field : "type" , title : "Type" , ...
KendoUI速查手册--中文
Kendo Grid 下载/导出到 CSV 使用客户端过滤和排序时,下载 Kendo UI 网格控件的排序、过滤内容(如果您使用免费版本,则可能会这样做)。依赖项: jQuery - 可能是任何版本,当然是任何足以支持 Kendo Grid 的最新...
ui jquery kendo ui 一个不错的国外ui kendoui 又名剑道UI ui jquery kendo ui 一个不错的国外ui kendoui 又名剑道UI
kendoui multiselectingrid,自定义选择显示grid中的td
kendo ui的中文国际化文件。已经对日期格式化进行了修正。 详细的,请看我的博文,kendo ui那点事里有详细使用说明。
Kendo UI Professional目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四个控件。Kendo UI for jQuery是创建现代Web应用程序的最完整UI库;Kendo UI...