KendoUI Grid

Grid

by JSDavi

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2014.1.416/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.416/js/kendo.all.min.js"></script>
<div id="grid"></div>

JavaScript

$("#grid").kendoGrid({
    toolbar: [{
        name: "create",text:"添加成员"
    }, {
        name: "save"
    }, {
        name: "cancel"
    }],
    columns: [{
        field: "name"
    }, {
        field: "age"
    },{ 
        command: [
            {
                name:"edit",
                text:{ edit: "编辑", cancel: "取消", update: "更新" }
            }, {name:"destroy",text:"删除"}], 
        title: "&nbsp;",
        width: "200px" }],
    dataSource: {
        data: [{
            id: 1,
            name: "Jane Doe",
            age: 30
        }, {
            id: 2,
            name: "John Doe",
            age: 33
        }, ],
        schema: {
            model: {
                id: "id"
            }
        }
    },
    editable: "popup"
});