对 ExtJS TreePanel 中的列进行排序会更改节点记录的顺序，而不仅仅是叶子

Question

我已经设法实现了一个树面板，一切似乎都在工作。我有这样的数据（见下文）。我的字段 I "name" 包含以下内容，例如 "ItemA"、"ProductA" 是节点，"Iron" 是叶子，属性称为 "Available" 是真/假（布尔值，但表示为字符串）。

单击布尔值的排序列时，它会对它们进行排序，但会作为整体进行排序。即我只想对每组中的布尔值进行排序。目前它将它们排序为看起来的项目组。所以 ItemB 下的节点改变了顺序，而不仅仅是布尔列的顺序。我希望这是有道理的。

我将列模型设置为此

        sortType: Ext.data.SortTypes.asUCString

我也试过在树面板中将 "folderSort" 的属性在 true 和 false 之间更改，但没有区别。

有什么想法吗？

这是我的数据示例，可以尝试更好地可视化它。

 ItemA
    ProductA
       Iron        true

 ItemB
    Product123
       House       true
       Garage      false
       Misc        false
    Product1443
       HouseF      true
       NewItem     false

Answer 1

据我从你的问题中了解到，你不能只对叶子而不是节点进行排序。因此，您可以指定叶子和节点模型，然后将 "available" 属性设置为叶子。请检查此 fiddle：https://fiddle.sencha.com/#fiddle/upv

如果这不是您想要的或者无法更改您的树面板模型，请更改 fiddle 并添加您的树面板及其模型。希望对你有帮助。

Ext.define('model.ItemsRoot', {
    extend: 'Ext.data.TreeModel',
    childType: 'model.Items',
    fields: [{
        name: 'text',
        mapping: 'name'
    },{
        name: 'Available',
        type: 'boolean'
    }]
});
Ext.define('model.Items', {
    extend: 'Ext.data.TreeModel',
    childType: 'model.Products',
    fields: [{
        name: 'text',
        mapping: 'name'
    }]
});
Ext.define('model.Products', {
    extend: 'Ext.data.TreeModel',
    childType: 'model.ItemNames',
    fields: [{
        name: 'text',
        mapping: 'name'
    }]
});
Ext.define('model.ItemNames', {
    extend: 'Ext.data.TreeModel',
    fields: [{
        name: 'text',
        mapping: 'name'
    }]
});
var treeStore = Ext.create('Ext.data.TreeStore', {
    model: 'model.ItemsRoot', 
    root: {
        text: '',
        expanded: true,
        children: [{
            name: "Item A",
            expanded: true,
            children: [{
                name: "Product A",
                expanded: true,
                children: [{
                    name: "Iron",
                    leaf: true,
                    Available: true
                }]
            }]
        }, {
            name: "Item B",
            expanded: true,
            children: [{
                name: "Product B",
                expanded: true,
                children: [{
                    name: "House",
                    Available: false,
                    leaf: true
                }, {
                    name: "Garage",
                    leaf: true,
                    Available: true
                }, {
                    name: "Misc",
                    leaf: true,
                    Available: false
                }]
            }, {
                name: "Product C",
                expanded: true,
                children: [{
                    name: "House F",
                    leaf: true,
                    Available: true
                }, {
                    name: "New Item",
                    leaf: true,
                    Available: false
                }]
            }]
        }]
    }
});
var treePanel = Ext.create('Ext.tree.Panel', {
    store: treeStore,
    rootVisible: false,
    columns: [{
        xtype: 'treecolumn', //this is so we know which column will show the tree
        text: 'Items',
        flex: 2,
        sortable: true,
        dataIndex: 'name'
    }, {
        //xtype: 'checkcolumn',
        header: 'Available',
        dataIndex: 'Available',
        //stopSelection: false,
        //menuDisabled: true,
        editor: {
            xtype: 'checkbox',     
        }
    }],
    renderTo: Ext.getBody()
});

对 ExtJS TreePanel 中的列进行排序会更改节点记录的顺序，而不仅仅是叶子

Sorting a column in a ExtJS TreePanel changes order of records of the nodes not just leafs

javascript

extjs

extjs4.1

extjs4.2