Limit Child length in Extjs Tree

I want to limit the length of a child node to 20 cha开发者_开发百科racters,something like xxxxxxxxxxxxxxxxxxxx...

The data for tree would be coming from database in Json format. Here is my code.

Ext.onReady(function(){

var Tree = Ext.tree;

var tree = new Tree.TreePanel({
    useArrows: true,
    autoScroll: true,
    animate: true,
    enableDD: true,
    containerScroll: true,
    border: false,
    // auto create TreeLoader
    dataUrl: 'test.json',

    root: {
        nodeType: 'async',
        text: 'Ext JS',
        draggable: false,
        id: 'src'
    }
});

// render the tree
tree.render('tree-div');
tree.getRootNode().expand(); });

In order to do this, you'll need define a custom tree loader and override the createNode function:

var tree = new Tree.TreePanel({
    useArrows: true,
    autoScroll: true,
    animate: true,
    enableDD: true,
    containerScroll: true,
    border: false,

    loader: new Ext.tree.TreeLoader({
        dataUrl: this.dataUrl,
        createNode: function(attr) {
            attr.text = attr.text.substr(0, 20);
            Ext.tree.TreeLoader.superclass.createNode.call(this, attr);
        }
    }),

    root: {
        nodeType: 'async',
        text: 'Ext JS',
        draggable: false,
        id: 'src'
    }
});