| Issue 214: | removing a node leaves empty space | |
| 1 person starred this issue and may be notified of changes. | Back to list |
What steps will reproduce the problem? 1. Create a parent node with only one child 2. remove the child node (If possible, please attach an example HTML file, that works when copied into the dynatree/doc/ folder.) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="../jquery/jquery.js" type="text/javascript"></script> <script src="../jquery/jquery-ui.custom.js" type="text/javascript"></script> <script src="../jquery/jquery.cookie.js" type="text/javascript"></script> <link href="../src/skin/ui.dynatree.css" rel="stylesheet" type="text/css"> <script src="../src/jquery.dynatree.js" type="text/javascript"></script> <!-- Start_Exclude: This block is not part of the sample code --> <link href="prettify.css" rel="stylesheet"> <script src="prettify.js" type="text/javascript"></script> <link href="sample.css" rel="stylesheet" type="text/css"> <script src="sample.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#Div1").dynatree( { children: [ // Pass an array of nodes. {title: "Item 2", key: "2" }, { title: "Item 1", key: "3" ,children: [ { title: "Item 12", key: "12" } ] } , { title: "Item 4", key: "4" } ] } ); }); function addTest() { var tree = $("#Div1").dynatree("getTree"); var activeNode = tree.getActiveNode(); activeNode.addChild({ title: "new", key: "88" + Math.random() }); } function removeTest() { var tree = $("#Div1").dynatree("getTree"); var activeNode = tree.getActiveNode(); activeNode.removeChildren() activeNode.remove(); } function add() { var f = function(){addTest();}; setTimeout(f,0); } function remove() { var f = function(){removeTest();}; setTimeout(f,0); } </script> </head> <body> <form id="form1" runat="server"> <div> <div id="Div1" > </div> <button onclick="add()" >Add Node</button> <button onclick="remove()">Delete Node</button> </div> </form> </body> </html> What is the expected output? What do you see instead? After all the child nodes are removed a space is left where the last child node was. Happens only in ie. The UL elelment that is left empty for some reason still occupies space. What version of the product are you using? On what operating system and browser? Internt Explorer7 windows XP
Jul 5, 2011
I copied your code inti a html file, but it doesn't run.
Can you reproduce it here:
http://jsfiddle.net/mar10/xj5au/
([Fork] - Modify code - [Update] - [Share])
Jul 5, 2011
(No comment was entered for this change.)
Status:
Waiting
Aug 16, 2011
No answer - closing
Status:
Done
Feb 16, 2012
http://jsfiddle.net/xj5au/84/ open in IE7 and remove nodes under folder2 by clicking button2. after removing last second subnode empty space is visible
Jul 17, 2012
considered verified
Jul 17, 2012
(No comment was entered for this change.)
Status:
Verified
Nov 30, 2013
$("#btnAddCode").click(function () {
// Sample: add an hierarchic branch using code.
// This is how we would add tree nodes programatically
var rootNode = $("#tree").dynatree("getRoot");
var childNode = rootNode.addChild({
title: "New Class",
tooltip: "This folder and all child nodes were added programmatically.",
isFolder: false
});
childNode.addChild({
title: "New Division",
icon: "customdoc1.gif"
});
});
May 19, 2014
I am having the same problem in IE9 in compatibility mode on Win7 with lates version of dynatree(1.2.6). Solved this by toggling expansion state of parent node before and after node.remove(). Works perfecly finde for me. |
Labels: Milestone-Release1.2