How to remove the empty folder in the tree grid

Question

My treegrid looks like this: tree grid

but there is also an empty folder in the beginning. I don't want this to be there. So what is wrong with my json:

{
"children": [
    {
        "type": "Videotechnicus",
        "prijs": "35",
        "children": [
            {
                "id": 52,
                "uren": "09:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 0,
                "type": "Laden",
                "leaf": true
            },
            {
                "id": 53,
                "uren": "10:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Reizen",
                "leaf": true
            },
            {
                "id": 54,
                "uren": "11:30:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Bouwen",
                "leaf": true
            },
            {
                "id": 55,
                "uren": "12:30:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 0,
                "type": "Lunch",
                "leaf": true
            },
            {
                "id": 56,
                "uren": "16:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Plenair live",
                "leaf": true
            },
            {
                "id": 57,
                "uren": "17:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Afbouw",
                "leaf": true
            },
            {
                "id": 58,
                "uren": "18:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Terugreis",
                "leaf": true
            },
            {
                "id": 59,
                "uren": "19:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 0,
                "type": "Uitladen",
                "leaf": true
            }
        ],
        "leaf": false
    },
    {
        "type": "Cameraman",
        "prijs": "45",
        "children": [
            {
                "id": 52,
                "uren": "09:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 0,
                "type": "Laden",
                "leaf": true
            },
            {
                "id": 53,
                "uren": "10:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Reizen",
                "leaf": true
            },
            {
                "id": 54,
                "uren": "11:30:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Bouwen",
                "leaf": true
            },
            {
                "id": 55,
                "uren": "12:30:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 0,
                "type": "Lunch",
                "leaf": true
            },
            {
                "id": 56,
                "uren": "16:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Plenair live",
                "leaf": true
            },
            {
                "id": 57,
                "uren": "17:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Afbouw",
                "leaf": true
            },
            {
                "id": 58,
                "uren": "18:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 1,
                "type": "Terugreis",
                "leaf": true
            },
            {
                "id": 59,
                "uren": "19:00:00",
                "aanwezig": 1,
                "bedrag": 100,
                "totaal": 100,
                "factureren": 0,
                "type": "Uitladen",
                "leaf": true
            }
        ],
        "leaf": false
    }
]
}

or with my store:

Ext.define('MyApp.store.opdrachtPersoneelTree', {
extend: 'Ext.data.TreeStore',
alias: 'store.opdrachtPersoneelTree',

requires: [
    'MyApp.model.personeelOfferteTree'
],

constructor: function(cfg) {
    var me = this;
    cfg = cfg || {};
    me.callParent([Ext.apply({
        autoLoad: true,
        model: 'MyApp.model.personeelOfferteTree',
        storeId: 'opdrachtPersoneelTree',
        nodeParam: 'type',
        proxy: {
            type: 'ajax',
            url: 'json/opdrachtpersoneel.php',
            reader: {
                type: 'json'
            }
        }
    }, cfg)]);
}
});


Ext.define('MyApp.model.personeelOfferteTree', {
extend: 'Ext.data.Model',

fields: [
    {
        name: 'type'
    },
    {
        name: 'uren'
    },
    {
        name: 'aanwezig'
    },
    {
        name: 'bedrag'
    },
    {
        name: 'totaal'
    }
]
});

There is another bug in there. When i close 'Cameraman' my firefox crash with this error: too much recursion and/or it will show all the leafs again:

enter image description here

I made it in architect so maybe there is a problem too. What is it what i am doing wrong?

Cheers

score 1 · Accepted Answer · answered Nov 12 '13 at 10:33

1

This is really two questions, to answer the question the title asks, the first node isnt really an empty folder (at least not in the picture you provide) its actually the top level root, to hide it simply set:

rootVisible : false

I'd have to look into the recursion issue further before offering an explanation- you may want to split that out into another question, as given the current title you may not attract those able to answer it for you.

answered Nov 12 '13 at 10:33

SW4

69,876
20
132
137

the rootVisible was what i was looking for thanks! I edit the question, not the best way to do it sorry :( – Rick Weller Nov 12 '13 at 11:28
So future users view a cohesive thread/question/answer, you should separate out the question regarding the recursive issue into a new question, instead of changing the question itself – SW4 Nov 12 '13 at 12:55

How to remove the empty folder in the tree grid

1 Answers1