Question

我有一个表单和一个面板树，当我提交此表单时，我想用新添加的数据刷新我的树。

所以这是我表单上的提交按钮代码（你可以看到我尝试过的一切，很抱歉）

buttons: [{    
    text: 'Save',
    handler: function () {
        this.up('form').getForm().submit({
            url: 'AddData.ashx',
            params: { action: 'addasset' },
            success: function (form, action) {
                Ext.MessageBox.show({
                    title: 'Success !',
                    msg: 'Asset added successfully<br />',
                    icon: Ext.MessageBox.INFO
                })
            }
        })

        //refresh  tree 
        //        var at = Ext.getCmp('atree');   at.getLoader.load(at.getRootNode(Ext.decode(objt.TreeToJson()))); 
        //        ATreeStore.loadData(Ext.decode(objt.TreeToJson()));
        //        var at = Ext.getCmp('atree');
        //        at.getView().getTreeStore().setRootNode(at.getView().getTreeStore().getRootNode().getChildAt());
        //        at.getView().refresh();                         
        //        Ext.ComponentQuery.query('treepanel')[4].getStore().load();
        //        Ext.ComponentQuery.query('assettree')[0].setRootNode(Ext.decode(objt.AssetTreeToJson()));
        //        ATreeStore.setRootNode(ATreeStore.getRootNode().getChildAt());
        //        ATreeStore.load();    

        ATreeStore.setRootNode(Ext.decode(objt.TreeToJson())); 
    }
}, {
    text: 'Cancel',
    handler: function () {
        this.up('form').getForm().reset();
    }
}]

这是我的树形码（不用担心锥形菜单，我还在尝试做工作）

window.ATreeStore = Ext.create('Ext.data.TreeStore', {
    root: Ext.decode(objt.TreeToJson())
});

var myContextMenu = new Ext.menu.Menu({
    items: [{
        text : 'Edit'
    }, {
        text: 'Delete'
    }]
});

Ext.define("Ext.app.ATree", {
    extend: "Ext.tree.Panel",
    alias:"widget.atree",
    title: ' my tree',
    height: 200,
    //id: 'atree',
    layout: 'fit',
    //width: 300,
    border: false,
    store: ATreeStore,
    //rootVisible: false,
    useArrows: true,
    frame: true,
    closable: true,
    collapsible: true,
    animCollapse: true,
    draggable: true,
    resizable: true,
    margin: ' 5 5 5 5',

    dockedItems: [{
        xtype: 'toolbar',
        items: [{
            text: 'reload',
            handler: function () {
                Ext.ComponentQuery.query('atree')[0].setRootNode(Ext.decode(objt.AssetTreeToJson()));
            }
        }, {
            text: 'delete',
            handler: function (record) {
                alert(record.data.id)
            }
        }]
    }],

    listeners: {
        itemcontextmenu:
        function (node, event) {
            node.select();
            myContextMenu.showAt(event.xy);
        }
    }
});

Answer 1

要重新加载一个树存储，你可以tree.getStore().load当然需要在调用之前以某种方式获取对tree的引用。 Sencha doc参考： http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.TreeStore-method-load

但是，如果您的表单提交应该向树中添加某些内容，则您的代码可能会出现计时问题，因为表单提交是异步的。您可能希望在表单提交的成功处理程序中调用树刷新功能。

如何在extjs4中重新加载树面板？

1 个答案: