easyui-treegrid 数据格式

1.远程加载

      <div class="easyui-layout" data-options="fit:true">
        <!-- 下 -->
        <div data-options="region:'center',border:true" class="grid-lines-bottom-only">
            <!-- 表 -->
            <table id="${data1_id}" class="easyui-treegrid" 
                data-options="rownumbers:true,
                           striped:true,
                           remoteSort:false,
                           multiSort:false,
                           singleSelect:true,
                           fitColumns:true,
                           border:false,
                <%--            onLoadSuccess:showFileds_${g_modid}, --%>
                           fit:true,
                           idField: 'aid',
                           treeField: 'title',
                             url:'${ctx}/datamotor/qry/${data1_dsid}',   
                           method:'post'">
                <thead>
                    <tr>
 <%--                        ${data1_col} --%>
                    </tr>
                </thead>
            </table>      
            <!-- 表结束 -->
        </div>
        <!-- 下结束 -->
    </div>


2.加载本地数据

格式如下

[{
"id":1,
"text":"My Documents",
"children":[{
"id":11,
"text":"Photos",
"state":"closed",
"children":[{
"id":111,
"text":"Friend"
},{
"id":112,
"text":"Wife"
},{
"id":113,
"text":"Company"
}]
},{
"id":12,
"text":"Program Files",
"children":[{
"id":121,
"text":"Intel"
},{
"id":122,
"text":"Java",
"attributes":{
"p1":"Custom Attribute1",
"p2":"Custom Attribute2"
}
},{
"id":123,
"text":"Microsoft Office"
},{
"id":124,
"text":"Games",
"checked":true
}]
},{
"id":13,
"text":"index.html"
},{
"id":14,
"text":"about.html"
},{
"id":15,
"text":"welcome.html"
}]
}]


 2.例子<div id="map_alarmfilter_tree" class="easyui-tree" data-options="method:'get',animate:true,checkbox:true" style="height:385px;width:630px;overflow-y:auto"></div>

3.var alarmfilterdata = arrayRowToTreeData(_data.rows, 'aid', 'grpid', 'children');

其中_data.rows数据如下


/**
 * 将json串转换成树形结构
 * @param array 要转换的数组
 * @param idStr id字段
 * @param pidStr 父节点字段
 * @param chindrenStr 子节点字段
 */  
function arrayRowToTreeData(array, idStr, pidStr, chindrenStr) {  
    var ret = [], hash = {}, id = idStr, pid = pidStr, children = chindrenStr, len = array.length;
    for (i = 0; i < len; i++) {
        hash[array[i][id]] = array[i];
    }
    for (j = 0; j < len; j++) {
        var aVal = array[j], hashVP = hash[aVal[pid]];  
        if (hashVP) {  
            !hashVP[children] && (hashVP[children] = []);  
            hashVP[children].push(aVal);  
        } else {
            ret.push(aVal);
        }
    }
    return ret;
}

4.jsonAddTextAttr_alarmfilter(alarmfilterdata);

    function jsonAddTextAttr_alarmfilter(data) {
        for (var i = 0; i < data.length; i++) {
            data[i].id = data[i].aid;
            data[i].text = data[i].text;
            if(data[i].id > 0 && data[i].notice == 1){//默认不勾选父节点
                data[i].checked = true;
            }
            if(data[i].id < 0){
                data[i].state = 'closed';
            }else{
                data[i].state = 'open';
            }
            data[i].attributes = null;
            if (data[i].children == null) 
                data[i].iconCls = 'icon-tree-folder';
            if (data[i].children != null) {
                jsonAddTextAttr_alarmfilter(data[i].children);
            }
        }
    }

5、                        var alarmfilter = $('#map_alarmfilter_tree');
                        alarmfilter.tree({
                            data: alarmfilterdata,//加载数据
                            onDblClick: function(node){//双击展开事件
                                if(node.grpid == null && node.state == 'closed'){
                                    alarmfilter.tree('expand', node.target);
                                }else if(node.grpid == null && node.state == 'open'){
                                    alarmfilter.tree('collapse', node.target);
                                }
                            }
                        });

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值