Question

在extjs应用程序中，我有一个从商店加载json数据的树面板。在该信息中，我有一个属性checked，允许操作树面板中一行的复选框。

如何通过听按钮以图形方式取消选中复选框？（清除所有复选框）

这是一个解释有点情况的小提琴。

https://fiddle.sencha.com/#fiddle/17v3

Answer 1

更新你的代码：

Ext.application({
    name: 'Fiddle',

    launch: function() {
        Ext.define('modeloCapa', {
            extend: 'Ext.data.Model',
            fields: ['nombre']
        });

        var treeStore = Ext.create('Ext.data.TreeStore', {
            model: 'modeloCapa',
            proxy: {
                type: 'ajax',
                url: "data1.json",
                reader: {
                    type: 'json',
                    root: 'Result'
                }
            }
        });

        var tree = Ext.create('Ext.tree.Panel', {
            title: 'Test',
            width: 500,
            store: treeStore,
            rootVisible: false,
            renderTo: Ext.getBody(),
            columns: [{
                xtype: 'treecolumn',
                flex: 2,
                sortable: true,
                dataIndex: 'titulo'
            }],tbar: [{
                xtype: 'button',
                 id: 'btnApagarCapas',
                 text : 'Button',
                 width: 100,
                 tooltip: 'Uncheck!!',
                 iconAlign : 'center',
                    listeners: {
                        click : function(){
                            treeStore.suspendEvents();
                            treeStore.getRootNode().cascadeBy(function(node) {
                                if (node.get('checked')) {
                                    node.set('checked', false);
                                }
                            });
                            treeStore.resumeEvents();
                            tree.getView().refresh();
                    }
                }
            }]
        });
    }
});

遍历所有节点，取消选中已检查的节点。挂起事件是为了防止视图在未选中时刷新每个节点，只是在最后批量完成。

ExtJs清除树状面板中的复选框

1 个答案: