Question 136763 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Select and Edit upon creation of node.appendChild in EXTJS

I’m very new to Extjs, Im currently working with a tree, where I can create a branch and then create sections. I would need help with editing function for my code.

createSection: function(button) {
var node = button.up(‘menu’).node;

    if (node.data.leaf) {
        return false;
    }

    node.expand();

    var newSection = node.appendChild({
        name: 'New section ' + "(" + (node.childNodes.length +1) + ")" ,
        type: 'toc-by-system',
        leaf: false,
        id: uuid['v4'](),
        children: [],
        editor: {
            xtype: 'textfield'
        }
    });

    newSection.BeginEdit(),
},
Tags:

2

Answers


  1. 0

    Please check the sample code, to add node programmatically on button click!

    var store = Ext.create('Ext.data.TreeStore', {
            root: {
                expanded: true,
                children: [{
                    id: 3,
                    text: 'detention'
                }, {
                    text: 'homework',
                    id: 5,
                    expanded: true,
                    children: [{
                        text: 'book report',
                        id: 7,
                        leaf: true
                    }, {
                        text: 'algebra',
                        id: 9,
                        leaf: true
                    }]
                }, {
                    text: 'buy lottery tickets',
                    id: 37,
                    leaf: true
                }]
            }
        });

        Ext.create('Ext.tree.Panel', {
            title: 'Simple Tree',
            itemId: 'menu',
            tbar: [{
                text: 'button',
                handler(button) {
                    var treeNode = button.up('#menu').getRootNode();
                    if (treeNode.data.leaf) {
                        return false;
                    }
                    treeNode.expand();
                    treeNode.appendChild({
                        text: 'New section ' + ((treeNode.childNodes.length) + 1),
                        type: 'toc-by-system',
                        leaf: false,
                        children: [],
                    });
                }
            }],
            width: 500,
            height: 500,
            store: store,
            rootVisible: false,
            renderTo: Ext.getBody()
        });
    Login or Signup to reply.
  2. 0

    Check this fiddle it has option for both single click and double click to edit
    Dynamic tree cell editor

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search