easyui(1)——treegrid

1.非编辑状态下，依旧显示checkbox，使用formatter实现：

 

                        {
                            field: "IsSecret", title: "是否XX", width: 100, align: 'center',
                            formatter: function (value, row, index) {
                                if (row.LS_Parent_Id == 'P') {//根据字段值判断是否为子节点
                                    var tt = "<input type=\"checkbox\"   value=\""+value + "\"";  
                                    if (value == "Y") {
                                        tt += "  checked=\"checked\"  ";
                                    }
                                    tt+="   disabled >";
                                    return tt;
                                }
                                else { return ""; }
                            }
                        },

2.选中某行父节点，自动展开，其它折叠：

                ,onSelect: function (row) {
                    if (row.LS_Parent_Id == 'P') {
                        $('#Tab_COO_HD').treegrid('collapseAll');
                        $('#Tab_COO_HD').treegrid('expand', row.S_Id);
                    }
                }

3.treegrid翻页有点问题，修改一下：

        function loadTree(page, rows) {//页码   每页行数
            var param = {};
            param.flag = new Date();
            if (page == -1 && rows == -1) {
                var options = $("#Tab_COO_HD").treegrid("options");
                param.page = options.pageNumber;
                param.rows = options.pageSize;
            } else {
                param.page = page;
                param.rows = rows;
            }
            param.dir = dir;//存放了一个查询字段
            var url = XXXXXXX;
            $.post(url, param, function (data) {
                $('#Tab_COO_HD').treegrid('loadData', data);
                $("#Tab_COO_HD").treegrid('getPager').pagination("loaded");
                $("#Tab_COO_HD").treegrid("loaded");
            }, 'json');
        }

应用：

            //翻页设置
           $("#Tab_COO_HD").treegrid('getPager').pagination({
                onSelectPage: function (pageNumber, pageSize) {
                    loadTree(pageNumber, pageSize); //分页控件上的所有对分页相关的事件，只要这个就好了
                }
            });

        //查询设置，得出一个结果查询好几遍，待完善
        function query() {
            var options = $("#Tab_COO_HD").treegrid('getPager').data("pagination").options;
            var curr = options.pageNumber;  //获得当前页
            var currsize = options.pageSize;//获取当前页设置的行数

            dir = $(XX).val();//查询条件
            var url = "XXX.ashx?method=XXX&dir=" + dir + "&page=1&rows=10&tmp=" + new Date().getTime();
            $.post(url, {}, function (data) {
                var d1 = data.total;//获取条数
                var d2 = JSON.stringify(data);
                var d = data;//返回json格式结果
                if (d1 == "0") {
                    $('#Tab_COO_HD').treegrid('loadData', []);//数据      $("#Tab_COO_HD").treegrid('getPager').pagination("loaded");
                    $('#Tab_COO_HD').datagrid('loadData', { total: 0, rows: [] });//footer
                } else {
                    $('#Tab_COO_HD').treegrid('load',
                        {
                            dir: dir
                        });
                    loadTree(1, currsize); 
                }
            }, 'json');
            editingId = null;//编辑状态下的查询
        }

4.扩展treegrid的事件，为其添加和移除编辑器：

        $.extend($.fn.treegrid.methods, {
            addEditor: function (jq, param) {
                if (param instanceof Array) {
                    $.each(param, function (index, item) {
                        var e = $(jq).datagrid('getColumnOption', item.field);
                        e.editor = item.editor;
                    });
                } else {
                    var e = $(jq).datagrid('getColumnOption', param.field);
                    e.editor = param.editor;
                }
            },
            removeEditor: function (jq, param) {
                if (param instanceof Array) {
                    $.each(param, function (index, item) {
                        var e = $(jq).datagrid('getColumnOption', item);
                        e.editor = {};
                    });
                } else {
                    var e = $(jq).datagrid('getColumnOption', param);
                    e.editor = {};
                }
            }
        });

应用：

            $("#Tab_COO_HD").treegrid('removeEditor', 列名);//移除

            $("#Tab_COO_HD").treegrid('addEditor', [{//增加
                field: 列名, editor: {
                    type: 'combobox',
                    options: {
                        valueField: 'label',
                        textField: 'value',
                        required: true,
                        hasDownArrow: true,
                        editable: false,
                        data: [{ label: '111', value: '111' }
                             , { label: '222', value: '222' }]
                    }
                }
            }]);