Скрывать в дереве только необходимые разделы

[Ambassador]

Приветствую.
В дереве при нажатии на кнопку скрываю записи:

{
       text: 'Collapse All',
       handler:function()
           {
    	    me.collapseAll()    	
           }
     }

Скрываются все записи, остается в видимости только Root.
Как сделать что бы находящиеся под Root 1го уровня разделы отображались?
Т.е что бы было так:
All otdels
----Otdel1
----Otdel2

А так же как можно реализовать скрытие дерева в handler кнопки, если она будет находиться не в initComponent: function() ?

Пример в fiddle
Спасибо

[siber-biber]

Как сделать что бы находящиеся под Root 1го уровня разделы отображались?
Т.е что бы было так:
All otdels
----Otdel1
----Otdel2

вызывайте collapse (https://docs.sencha.com/extjs/6.5.2/...ethod-collapse) на записях которые должны остаться отображаемыми.

{
                            text: 'Collapse All',
                            handler:function()
    						{
                                var nodesToCollapse = me.getStore().getRoot().childNodes;
                        
                                Ext.each(nodesToCollapse, function (node) {
                                    node.collapse();
                                });
                            }
                        }

[Ambassador]

{
                            text: 'Collapse All',
                            handler:function()
    						{
                                var nodesToCollapse = me.getStore().getRoot().childNodes;
                        
                                Ext.each(nodesToCollapse, function (node) {
                                    node.collapse();
                                });
                            }
                        }

siber-biber - Спасибо

Что касаемо второго вопроса: "как можно реализовать скрытие дерева в handler кнопки, если она будет находиться не в initComponent: function()?", то сделал так:

{
        text: 'Развернуть',
        handler : function(button, e) {
        var tree    = button.up('questiontree')    
        tree.expandAll()
    	tree.resumeLayouts(true)  
            
    }
    },
    {
        text: 'Свернуть',
        handler:function(button, e)
        {
            var tree    = button.up('questiontree')
            var nodesToCollapse = tree.getStore().getRoot().childNodes
            Ext.each(nodesToCollapse, function (node) {
                node.collapse();
            });
            console.log(node)
        }
    }

Работает, но при нажатии на "Развернуть" в консоли предупреждение:

Mismatched call to resumeLayouts - layouts are currently not suspended

пер. Несоответствие вызова resumeLayouts - макеты в настоящее время не приостановлены .

При нажатии на "Свернуть" ошибка:

ReferenceError: node is not defined

Почему возникает предупреждение и ошибка?

[Swat2k]

А зачем вызывать tree.resumeLayouts(true), что вы хотели сделать?
А по поводу свернуть, у вас не определена переменная node

[Ambassador]

А зачем вызывать tree.resumeLayouts(true), что вы хотели сделать?

Подумал что это необходимый метод для правильного рендеринга записей дерева после их развертывания.
Спасибо