Jstree : Create node with custom div

javascript, jquery, jstree, tree

Solution

Try something like this:

$("#jsmenu").on("create_node.jstree", function (e, data) {
    $("li#"+data.node.id).find("a").append(html);
});

`html` is a var containing your icons code.

Problem

I use the plugin Jstree to manage my menu dynamically. I have custom my tree with some div to display icons and links : ``` <li rel="menu"> <a class="js_menu_titre"> <p class="jsmenu_titre_taille">Menu_Principal</p> <div class="jsmenu_lien">Link</div> <p class="jsmenu_icone">Actif : icon</p> <p class="jsmenu_action">Actions : icon_action</p> </a> ``` my problem is that when I want to use the function create node, I don't have my divs anymore. My customs divs are inside the link () You can see the result and the problem here : http://i71.servimg.com/u/f71/11/07/15/68/arbo10.jpg I use this function : ``` $("#jsmenu").bind("create.jstree", function (e, data) { $.post( "/static/v.1.0pre/_demo/server.php", { "operation" : "create_node", "id" : data.rslt.parent.attr("id").replace("node_",""), "position" : data.rslt.position, "title" : data.rslt.name, "type" : data.rslt.obj.attr("rel") }, function (r) { if(r.status) { $(data.rslt.obj).attr("id", "node_" + r.id); } else { $.jstree.rollback(data.rlbk); } } ); ``` }) and for my add button ``` function Ajouter() { $('#jsmenu').jstree("create", null, "last",{ "attr" : { "rel" : "folder" } }); } ```

Original source