Ext Js 4.2 tree editing

트리 이름 변경하기

HTML

<link rel="stylesheet" href="http://cdn.sencha.io/ext-4.2.0-gpl/resources/css/ext-all.css">
<div id="treeList"></div>

JavaScript

Ext.require(['*']);
Ext.onReady(function(){
    var  store = Ext.create('Ext.data.TreeStore', {
            id: 'store',
            proxy: {
            data : 
            [{
                "text": "R\u0026D구분",
                "children": [{
                    "text": "부문(합계)",
                    "leaf": true,
                }, {
                    "text": "부문(합계)",
                    "leaf": true
                }, {
                    "text": "부문(합계)",
                    "children": [],
                    "leaf": true
                }, {
                    "text": "부문(합계)",
                    "leaf": true
                }, {
                    "text": "부문(합계)",
                    "children": [],
                    "leaf": true
                }],
                "leaf": false,
                "expanded": true
            }, {
                "text": "민간IT분야",
                "leaf": true
            }],
            type:'memory',
            reader:{
                type:'json'
            }
        },
        root: {
            text: "ROOT",
            id: "ROOT",
            expanded: true
        },
        listeners: {
            update: function(st, rec, op, modFldNames) {
                console.log("트리에서 글 수정 후 여기를 탑니다.");
            }
        }
    });
    var tree = Ext.create('Ext.tree.Panel', {
        id: 'tree',
        rootVisible: true,
        multiSelect: false,
        store: store,
        height: 600,
        plugins: 'cellediting',
        columns: [{
            xtype: 'treecolumn',
            dataIndex: 'text',
            flex: 1,
            editor: {
                xtype: 'textfield',
                allowBlank: false,
                allowOnlyWhitespace: false
            }
        }],
        renderTo: Ext.get('treeList')
    });

 });