How to make child node editable the moment it is created?

Dear All,

I want make child node editable the moment it is added. Please help me out. As of now we have 'single click / double click' editable options (After an action). But i don't know how to make the child node editable the moment it is created.

Hello
Here is a little samle for you with context menu (because i don’t knoe how do you gonna add items)

[code]
function doOnLoad(){
menu = new dhtmlXMenuObject();
menu.renderAsContextMenu();
menu.setIconsPath("…/dhtmlxMenu/samples/common/imgs/");
menu.loadXML("…/___xml/data_tree_menu_context.xml");
menu.attachEvent(“onClick”, onButtonClick);

        dhxTree = new dhtmlXTreeObject("mytree", "300px", "300px", 0);
		dhxTree.setImagePath("../dhtmlxTree_prof/codebase/imgs/csh_vista/");
		dhxTree.loadXML("../___xml/data_tree_components.xml");
        dhxTree.enableContextMenu(menu);
        dhxTree.enableItemEditor(true);
        //dhxTree.enableHighlighting(true);
        dhxTree.attachEvent("onMouseIn", function(id){
            dhxTree.setItemColor(id, 'black', 'red')
        });
        //dhxTree.enableKeyboardNavigation(true);
		dhxTree.attachEvent("onBeforeContextMenu", function(id) {
			if (dhxTree.hasChildren(id) > 0) {
				menu.showItem('add');
			} else {
				menu.hideItem('add');
			}
			return true;
		});
        function onButtonClick(menuitemId, type) {
            var id = dhxTree.contextID;
            if (menuitemId == 'del'){
                dhxTree.deleteItem(id);
            }
            else {
                var parId = dhxTree.getParentId(id);
                var newId = id+"_chld";
                //var itemImage = dhxTree.getItemImage(newId,0);
                dhxTree.insertNewChild(id,newId,'itemText',0);
                dhxTree.editItem(newId);
            }
        }
	}
	</script>[/code]

XML for this tree:

<?xml version='1.0'?> <tree id="0" radio="1"> <item text="Components" id="comp" im0="_red.gif" im1="_red.gif" im2="_red.gif" > <item text="Using Container" id="cont" im0="_blue.gif" im1="_blue.gif" im2="_blue.gif" open="1"> <item text="dhtmlxLayout" id="lay" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> <item text="dhtmlxAccordion" id="acc" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> <item text="dhtlmxTabbar" id="tab" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> <item text="dhtmlxWindows" id="win" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> </item> <item text="Using Data" id="data" im0="_blue.gif" im1="_blue.gif" im2="_blue.gif" open="1"> <item text="dhtmlxGrid" id="grd" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> <item text="dhtmlxTree" id="tre" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> <item text="dhtmlxMenu" id="men" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> <item text="dhtmlxToolbar" id="too" im0="_green.gif" im1="_green.gif" im2="_green.gif"/> </item> </item> </tree>
And XML for menu:

[code]<?xml version='1.0' ?>

[/code]

Hi, Thanks for the reply.

The above solution is for ‘child editable’ on some ‘action’ performed(Ex. ‘onClick’ call somefunction). But my requirement is 'The moment child is created it should come as ‘editable state’ by default (without performing any action like ‘onClick’ or ‘onDblClick’).

Example: As like in windows, if we create ‘New Folder’, it will come as ‘editable state’ by default. (without ‘click’ action ).

Please help me.

It is similar approach:

[code]

tabbar html, body {width: 100%;height: 100%;margin: 0px;overflow: hidden;background-color:white;}
[/code] You just need to call dhxTree.editItem(newId) for every newId you create.