阅读背景:

ExtJs6 TreeGrid(级联选择树)_seasidexin的专栏_extjs6.2 treegrid

来源:互联网 

ExtJs6 TreeGrid

 

 

var treeGrid = Ext.create("Ext.tree.Panel", {
    flex: 1,
    store: {
        type: 'tree',
        fields: ['Name', 'ID', 'Type']
    },
    id: 'teleTreeGrid',
    useArrows: true,
    rootVisible: false,
    multiSelect: true,
    singleExpand: false,
    checkModel: 'cascade', // 对树的级联多选
    onlyLeafCheckable: false, // 对树所有结点都可选
    animate: false,
    root: {
        name: 'Root',
        description: 'Root description',
        expanded: true,
        checked: true,
        children: []
    },
    columns: [{
        xtype: 'treecolumn',
        text: '描述',
        dataIndex: 'Name',
        flex: 2
    }, {
        text: 'ID',
        dataIndex: 'ID',
        flex: 1
    }, {
        text: '关键字',
        dataIndex: 'Type',
        flex: 1
    }],
    listeners: {
        afterrender: function(pObj, eOpts) {},
        render: function(conSelf) {

            // 根节点(大当家的--隐藏)
            this.setRootNode({
                text: 'Root',
                expanded: true,
                checked: false,
                children: []
            });
            // 假的根节点(二当家的--显示)
            var root = this.getRootNode();
            var parent = root.appendChild({
                Name: 'Root',
                ID: '0',
                checked: false
            });
            parent.appendChild({
                Name: 'test1',
                ID: '',
                nodeType: 'test1',//自己加的属性
                leaf: false,
                checked: false
            });
            parent.appendChild({
                Name: 'test2',
                ID: '',
                nodeType: 'test2',//自己加的属性
                leaf: false,
                checked: false
            });
            parent.expand();
        },
        'itemdblclick': function(record, node, view, index) {
            // 处理点击事件
            var nodeId = Ext.isEmpty(node.data.ID) ? '' : node.data.ID + '';
            var nodeName = Ext.isEmpty(node.data.Name) ? '' : node.data.Name;
            var nodeType = Ext.isEmpty(node.data.nodeType) ? '' : node.data.nodeType;
			//请开始你的表演
			//业务代码

        },
        beforeitemexpand: function(node, index, item, eOpts) {
            // 假展开所有节点
            self.expandNode(node);
        },
        beforeitemcollapse: function(node, index, item, eOpts) {},
        "checkchange": function(node, checked, eOpts) {
            self.travelChildrenChecked(node, checked, eOpts);
            self.travelParentChecked(node, checked, eOpts);
            //  递归勾选节点
        }
    }
})var treeGrid = Ext.cr



你的当前访问异常,请进行认证后继续阅读剩余内容。

分享到: