Ext JS 4.2 트리

var tree = Ext.create('Ext.tree.Panel', {

    id:"gridTree",

    autoHeight:true,

    renderTo: Ext.get('dataArea'),

    useArrows: false,

    rootVisible: false,

    store: store,

    multiSelect: true,

    plugins: [

        Ext.create('Ext.grid.plugin.CellEditing', {

            clicksToEdit: 1

        })

    ],

    rowLines:true,

    columns: 컬럼(column)

});

tree.on('validateedit', function(editor, e) {

    if(e.record.data[e.field]==e.value){

        e.cancel = true;

    }

});

tree.on('edit', function(e){

    console.log("필드 값(field value)"+e.context.field);

    console.log("이전 값(before value)"+e.context.originalValue);

    console.log("현재 값(now value)"+e.context.value);

});

필자는 그리드에서 수정 된것을 'validateedit'라는 좋은 옵션이 있는데 'edit' 에서 하고있었다.

Ext Js 에서는 수정을 한 후 적용 전에 벨리데이션을 하는 곳이 따로 존재하였다.

그래서 'edit'에서 벨리데이션을 했던 모든 내용을 'validateedit'로 옮겼다.

실 작동 URL[http://jsfiddle.net/Kwangheum/SgmyP/2/]

Ext JS 4.2 트리

1.Ext JS 4.2 트리 기본구조

2.Ext JS 4.2 트리 이름 변경하기

3.Ext Js 4.2 트리 그리드 에디팅

4.Ext JS 4.2 트리 드래그 & 드롭
5.Ext JS 4.2 트리 노드 추가 및 스크롤 이동