how to use row-editor plugin for treeGrid

1.4k Views Asked by At

i have a treegrid and i need to make it as editorGrid.

My treegrid is

var tree = new Ext.ux.tree.TreeGrid({
    title: 'Core Team Projects',
     height: 500,
    renderTo: Ext.getBody(),
      autoLoad:false,
    plugins: [editor],
      columns:[
        {
        header: 'Name',
        dataIndex: 'name',
        width: 230
    },{
        header: 'length',
        width: 150,
        sortType: 'asFloat',
        dataIndex: 'length'
    },{
        header: 'size',
        width: 150,
        sortType: 'asFloat',
        dataIndex: 'size'
    },{
        header: 'dataType',
        width: 150,
        dataIndex: 'dataType'
    },{
        header: 'extName',
        width: 150,
        dataIndex: 'extName'
    },{
        header: 'overlay',
        width: 150,
        dataIndex: 'overlay'
    },{
        header: 'qualified',
        width: 150,
        dataIndex: 'qualified'
    }],
    loader: myTreeLoader

});

and the editor which i used is

var editor = new Ext.ux.grid.RowEditor({
    saveText: 'Save',
    errorSummary : true,
    monitorValid: true,
    clicksToEdit: 1,
    // floating: true,
    shadow: true,
    layout: 'hbox',
    cls: 'x-small-editor',
    buttonAlign: 'center',
    baseCls: 'x-row-editor',
    elements: 'header,footer,body',
    frameWidth: 5,
    buttonPad: 3,
    focusDelay: 250,
    cancelText: 'Cancel',
    //commitChangesText: 'You need to Update or Cancel your changes',
    // errorText: 'Errors',

    defaults: {
        normalWidth: true
    }
});

it gives an error "Object doesn't support this property or method"

Could Someone pls give a solution

1

There are 1 best solutions below

0
On

The "Ext.ux.tree.TreeGrid" in Extjs v3.x.x is not a real "grid" (based on treepanel + treeloader...), that's why you can't use "Ext.ux.grid.RowEditor" (because roweditor need a grid + store...).

2 Solutions:

  • Switch to Extjs v4.x.x and you can use "Ext.grid.plugin.CellEditing":

ExtJs TreeGrid with editor column. Exists?

  • Override createNode (in "Ext.ux.tree.TreeGridLoader") or modify the "Ext.ux.tree.TreeGridNodeUI":

http://www.sencha.com/forum/showthread.php?118393-treegrid-checkbox-extension

Checkbox Column in ExtJS TreeGrid

(Examples to put checkboxes you can modify to put others components...)

Good luck...