Could you explain how to have html tree and enable keyboard navigation?
My options don’t load. Should I use XML instead?
Thanks.
<!DOCTYPE html>
<html>
<head>
<!-- Tree -->
<link rel="stylesheet" type="text/css" href="codebase/dhtmlxtree.css" />
<script src="codebase/dhtmlx.js"></script>
<script src="codebase/dhtmlxcommon.js"></script>
<script src="codebase/dhtmlxtree.js"></script>
<script src="codebase/ext/dhtmlxtree_start.js"></script>
<script>
dhtmlx.skin = "dhx_skyblue";
</script>
</head>
<body>
<div id="treebox" setImagePath="codebase/imgs/csh_bluebooks/" class="dhtmlxTree" style="width:250px; height:350px; border:1px solid;">
<ul>
<li>Root
<ul>
<li>Child1
<ul>
<li><a href="#">Child 1-1</a></li>
</ul>
</li>
<li>Child2</li>
<li><b>Bold</b> <i>Italic</i></li>
</ul>
</li>
</ul></li>
</div>
<script>
var myTree = dhtmlXTreeFromHTML("treebox");
myTree.enableKeyboardNavigation(true);
myTree.openAllItems(1);
myTree.selectItem(1,false,false);
myTree.focusItem(1);
</script>
</body>
</html>
Darya
July 4, 2012, 9:50am
#2
Method enableKeyboardNavigation() is in the PROF edition. Do you have it?
docs.dhtmlx.com/doku.php?id=dhtm … vigation&s []=navigation
Yes, I have the prof edition.
Can you post a sample page that’s working?
Thanks.
I tried to get this working with XML also.
The strange thing is that local version of this file does not work:
14_selection_sorting_navigation/04_pro_key_nav.html
Your online version of this file works.
dhtmlx.com/docs/products/dht … y_nav.html
I cannot see why this should be?
I just did it from XML, which works on server, not locally, because my browser blocks the script.
I also needed to replace script loading:
<!DOCTYPE html>
<html>
<head>
<!-- Tree -->
<link rel="stylesheet" type="text/css" href="codebase/dhtmlxtree.css" />
<script src="codebase/dhtmlxcommon.js"></script>
<script src="codebase/dhtmlxtree.js"></script>
<script src="codebase/ext/dhtmlxtree_kn.js"></script>
<script src="codebase/ext/dhtmlxtree_ed.js"></script>
<script>
dhtmlx.skin = "dhx_skyblue";
</script>
</head>
<body onload="focusTree()">
<div id="treeboxbox_tree" style="width:250px; height:100%; background-color:#f5f5f5;border:1px solid Silver; overflow:auto;"></div>
<script type="text/javascript">
tree = new dhtmlXTreeObject("treeboxbox_tree", "100%", "100%", 0);
tree.setSkin('dhx_skyblue');
tree.setImagePath("codebase/imgs/csh_vista/");
tree.enableSmartXMLParsing(true);
tree.enableKeyboardNavigation(true);
tree.assignKeys([["up",37],["down",39]]);
tree.loadXML("Tree.xml");
function focusTree()
{
tree.selectItem(lb_1,false,false);
tree.focusItem(lb_1);
}
</script>
</body>
</html>
Now I can’t seem to select and focus first item in tree when page loads.
Could you help please? I used your XML, and tried both with and without quotes.
Thanks.
Darya
July 5, 2012, 9:04am
#6
If you have active support subscribtion, please create a ticket in the online support system and attach completed demo: docs.dhtmlx.com/doku.php?id=othe … leted_demo
Hi Darya,
I placed a support ticket, but while I was waiting for an answer, my year expired.
Can you please answer here how to select or focus when page loads?
Thanks.
Darya
July 9, 2012, 11:54am
#8
Hi, trinzia
Can’t reproduce your issue locally.
Could you provide us your xml to test it? And i’ll try to help you.