0

我有一个使用 Extjs 4 的检查树,我有一个问题:我的树每 30 秒重新加载一次,并且只重新加载扩展的特定节点。

var node = this.getMyDeviceTree().store.getNodeById('myTree/107');
this.getMyDeviceTree().store.load({ node: node });

我的检查树网格

当我选中树中的复选框时,重新加载商店后选中的复选框被取消选中。重新加载存储后如何记住选定的节点?

看法:

Ext.define('App.view.TreeDeviceStatus', {
    extend: 'Ext.tree.Panel',
    store: 'TreeDeviceStore',
    rootVisible: false,
    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            columns: [{
                    //treecolumn xtype tells the Grid which column will show the tree
                    xtype: 'treecolumn',
                    text: 'Biển số',
                    width: 140,
                    sortable: true,
                    dataIndex: 'text'
                }, {
                    text: 'Trạng thái',
                    width: 80,
                    sortable: true,
                    dataIndex: 'Status',
                }, {
                    text: 'Địa chỉ',
                    width: 250,
                    sortable: true,
                    dataIndex: 'Addr'
                }]
        });
        me.callParent(arguments);
    }
});

店铺:

Ext.define('App.store.TreeDeviceStore', {
    extend: 'Ext.data.TreeStore',
    model: 'App.model.DeviceStatusModel',
    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            proxy: {
                type: 'ajax',
                url: '/Service/GetData',
                extraParams: {
                    serviceName: 'DeviceService',
                    func: 'getStatus',
                    variable: '{"_UserID":"' + _USERID + '","_RoleID":"' + _ROLEID + '"}'
                },
            }
        }, cfg)]);
    },
    root: {
        id: 'myTree',
        //expanded: true
    },
    listeners: {
        load: function(tree, node, records) {
            if (node.get('checked')) {
                node.eachChild(function(childNode) {
                    childNode.set('checked', true);
                });
            }
        }
    }
});

多谢你们!

4

1 回答 1

1

如果一次仅从一个节点加载,则仅在该节点中恢复状态是有意义的。这就是为什么我会在知道已加载节点的函数中执行此操作。那将是这样的:

function() {
    var store = tree.getStore(),
        node = store.getNodeById('myTree/107'), // that's up to you here
        ids = [];

    function pluckCheckedIds(node) {
        if (node.get('checked')) {
            ids.push(node.getId());
        }
        node.eachChild(function(node) {
            pluckCheckedIds(node);
        });
    }

    // EDIT: forgot this line:
    pluckCheckedIds(node);

    // EDIT2: in order to save and restore the checked state for the whole 
    // tree (in order to load multiple nodes at once), you could use this
    // line instead:
    pluckCheckedIds(store.getRootNode());

    store.load({
        node: node,
        callback: function(records, operation) {
            if (operation.wasSuccessful) {
                Ext.each(ids, function(id) {
                    var node = store.getNodeById(id);
                    if (node) {
                        node.set('checked', true);
                    }
                });
            }
        }
    });
}
于 2013-08-01T09:22:42.323 回答