edit: Somehow i have forgotten to say hi... Hi guys!
so far i've always found an answere to my questions because the question has already been asked and answered. But this time i searched for hours and still have no idea why my code is not working how it is supposed to do.
To my background: i am an apprentice in the 2nd year, so please don't be to hard on me :-)
I am using Fancytree-2.12.0, jQuery-UI-1.11.4 and jQuery-1.11.3.
Here is the HTML Markup:
<div id="CategorieTree">
<ul id="treeData" style="display:none;">
<li id="rootNode" class="expanded">
<a href="loadPage.asp?Start=1"><strong>rootNode title</strong></a>
<ul>
<li id="100"><a href="loadPage.asp?Content=100">title 100</a></li>
<li id="200"><a href="loadPage.asp?Content=200">title 200</a>
<ul>
<li id="210"><a href="loadPage.asp?Content=210">title 210</a>
<ul>
<li id="211"><a href="loadPage.asp?Content=211">title 211</a></li>
<li id="212"><a href="loadPage.asp?Content=212">title 212</a></li>
</ul>
</li>
<li id="220"><a href="loadPage.asp?Content=220">title 220</a></li>
</ul>
</li>
<li id="300"><a href="loadPage.asp?Content=300">title 300</a>
<ul>
<li id="310"><a href="loadPage.asp?Content=310">title 310</a></li>
<li id="320"><a href="loadPage.asp?Content=320">title 320</a>
<ul>
<li id="321"><a href="loadPage.asp?Content=321">title 321</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
The Tree is displayed totally fine. But when i try to click an element and the links should reload the page with different content, nothing happens! When i open the dev-tools (i am using chrome Version 45.0.2454.101 m) i can see my original and another that is obviously created by FancyTree, but here all my IDs and the aTag-elments are removed like that:
<div id="CategorieTree">
<ul class="ui-fancytree fancytree-container fancytree-plain">
<li class="fancytree-lastsib">
<span class="lots of classes">
<span class="fancytree-expander"></span>
<span class="fancytree-title"><strong>rootNode title</strong></span>
</span>
<ul>
<li>
<span class="lots of classes">
<span class="fancytree-expander"></span>
<span class="fancytree-title">title 100</span>
</span>
</li>
<li>
<span class="lots of classes">
<span class="fancytree-expander"></span>
<span class="fancytree-title">title 200</span>
</span>
<ul>
<li>
<span class="lots of classes">
<span class="fancytree-expander"></span>
<span class="fancytree-title">title 210</span>
</span>
<ul>
<li>
....and so on
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
Here is my JavaScript for the initialization:
<script type="text/javascript">
$("#CategorieTree").fancytree({
activeVisible: true, // Make sure, active nodes are visible (expanded).
aria: false, // Enable WAI-ARIA support.
autoActivate: true, // Automatically activate a node when it is focused (using keys).
autoCollapse: false, // Automatically collapse all siblings, when a node is expanded.
autoScroll: false, // Automatically scroll nodes into visible area.
clickFolderMode: 4, // 1:activate, 2:expand, 3:activate and expand, 4:activate (dblclick expands)
checkbox: false, // Show checkboxes.
debugLevel: 2, // 0:quiet, 1:normal, 2:debug
disabled: false, // Disable control
focusOnSelect: false, // Set focus when node is checked by a mouse click
generateIds: false, // Generate id attributes like <span id='fancytree-id-KEY'>
idPrefix: "ft_", // Used to generate node id´s like <span id='fancytree-id-<key>'>.
icons: false, // Display node icons.
keyboard: true, // Support keyboard navigation.
keyPathSeparator: "/", // Used by node.getKeyPath() and tree.loadKeyPath().
minExpandLevel: 1, // 1: root node is not collapsible
quicksearch: false, // Navigate to next node by typing the first letters.
selectMode: 2, // 1:single, 2:multi, 3:multi-hier
tabbable: true, // Whole tree behaves as one single control
titlesTabbable: false // Node titles can receive keyboard focus
});
</script>
My Question is: Do aTags NEVER work when you initialize fancytree with pure HTML-Markup or did i just do something wrong?
Edit: I got my IDs!
generateIds: false;
had to be set to true.
Edit 2: I have not found a solution for my a-Tag problem. They still get removed when i initialize my tree with plain HTML-markup. Thus i have rewritten my code and now i initialize the tree by using the source-attribute.