easy ui treegrid使用


返回數據格式:
{"total":7,"rows":[
{"id":1,"name":"All Tasks","begin":"3/4/2010","end":"3/20/2010","progress":60,"iconCls":"icon-ok"},
{"id":2,"name":"Designing","begin":"3/4/2010","end":"3/10/2010","progress":100,"_parentId":1,"state":"closed"},
{"id":21,"name":"Database","persons":2,"begin":"3/4/2010","end":"3/6/2010","progress":100,"_parentId":2},
{"id":22,"name":"UML","persons":1,"begin":"3/7/2010","end":"3/8/2010","progress":100,"_parentId":2},
{"id":23,"name":"Export Document","persons":1,"begin":"3/9/2010","end":"3/10/2010","progress":100,"_parentId":2},
{"id":3,"name":"Coding","persons":2,"begin":"3/11/2010","end":"3/18/2010","progress":80},
{"id":4,"name":"Testing","persons":1,"begin":"3/19/2010","end":"3/20/2010","progress":20}
],"footer":[
{"name":"Total Persons:","persons":7,"iconCls":"icon-sum"}
]}

js初始:
$('#tt').treegrid({
                url: '/Category/GetAllCategory',
                title: '分類列表',
                width: 700,
                height: 500,
                animate: true,
                fitColumns: true,
                rownumbers: false,
                collapsible: true,
                idField: 'ID',
                treeField: 'CatName',
                loadMsg: '正在加載分類信息...',
                pagination: true,
                singleSelect: false,
                pageSize: 20,
                pageNumber: 1,
                pageList: [10, 20, 30],
                //queryParams: queryData, //異步查詢的參數
                columns: [[
                        { field: 'ck', checkbox: true, align: 'left', width: 50 },
                        { field: 'ID', title: '編號', width: 50 },
                        { field: 'CatName', title: '分類名', width: 150 },
                        //{ field: 'ParentId', title: '父級編號', width: 80 },
                        { field: 'TreePath', title: '樹目錄', width: 80 },
                        { field: 'Level', title: '級別', width: 80 },
                        {
                            field: 'IsLeaf', title: '是否是葉子節點', width: 120,
                            formatter: function (value, row, index) {
                                if (value == true) {
                                    return "是";
                                } else {
                                    return "否";
                                }
                            }
                        }                       
                ]],
                toolbar: [{
                    id: 'btnAdd',
                    text: '添加',
                    iconCls: 'icon-add',
                    handler: function () {
                        //添加
                        $("#showDialog").dialog("setTitle""添加分類").dialog("open");
                        $("#showWindow").attr("src""/Category/Create");
                    }
                },
                {
                    id: 'btnEdit',
                    text: '修改',
                    iconCls: 'icon-edit',
                    handler: function () {
                        //修改
                        var rows = $("#tt").datagrid("getSelections");
                        if (rows.length != 1) {
                            $.messager.alert("提示""請選擇一條數據");
                            return;
                        }
                        $("#showDialog").dialog("setTitle""修改角色").dialog("open");
                        $("#showWindow").attr("src""/Roles/Edit?ID=" + rows[0].ID);
                    }
                },
                {
                    id: 'btnDel',
                    text: '刪除',
                    iconCls: 'icon-remove',
                    handler: function () {
                        //刪除
                        var rows = $("#tt").datagrid("getSelections");
                        if (rows.length > 0) {
                            $.messager.confirm("提示""確定要刪除嗎?"function (b) {
                                if (b) {
                                    var ids = "";
                                    for (var i = 0; i < rows.length; i++) {
                                        ids += rows[i].ID + ",";
                                    }
                                    ids = ids.substring(0, ids.length - 1);
                                    $.post("/Roles/Delete", { ids: ids }, function (data) {
                                        if (data == "ok") {
                                            $("#tt").datagrid('reload');
                                            $("#tt").datagrid("clearSelections");
                                        } else {
                                            $.messager.alert("提示""刪除失敗");
                                        }
                                    });
                                }
                            });
                        }
                        else {
                            $.messager.alert("提示""請選擇要刪除的行");
                        }
                    }
                }]
            });
Html:
<table id="tt" style="width700px;" title="分類列表">
 </table>







免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM