Text direction (LTR/RTL)
dhtmlxTree supports both LTR and RTL text directions. LTR is set in the tree by default. To set RTL you should set the myTree.enableRTL() method to true, as it is mentioned below:
</> Source
<!DOCTYPE html>
<!--pro-->
<html>
<head>
<title>Text direction (LTR/RTL)</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/fonts/font_roboto/roboto.css"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
<script src="../../../codebase/dhtmlx.js"></script>
<link rel="stylesheet" type="text/css" href="../common/demo_style.css"/>
<script>
var myTree, myTree2;
function doOnLoad(){
myTree = new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
myTree.setImagePath("../../../skins/web/imgs/dhxtree_web/");
myTree.enableDragAndDrop(true);
myTree.enableSmartXMLParsing(true);
myTree.load("../common/tree.xml");
myTree2 = new dhtmlXTreeObject("treeboxbox_tree2","100%","100%",0);
myTree2.setImagePath("../../../skins/web/imgs/dhxtree_web/");
myTree2.enableSmartXMLParsing(true);
myTree2.enableDragAndDrop(true);
myTree2.setDragBehavior("sibling");
myTree2.enableRTL(true);
myTree2.load("../common/tree.xml");
}
</script>
</head>
<body onload="doOnLoad()">
<h1>Text direction (LTR/RTL)</h1>
<table>
<tr>
<td>
<div id="treeboxbox_tree" class="tree_demo_samples"></div>
</td>
<td style="padding-left:25px" valign="top">
<div id="treeboxbox_tree2" class="tree_demo_samples"></div>
</td>
</tr>
<tr>
<td>
<div><a href="#" onClick="myTree.enableRTL(false)">Tree 1 - LTR</a></div>
<div><a href="#" onClick="myTree.enableRTL(true)">Tree 1 - RTL</a></div>
</td>
<td style="padding-left:25">
<div><a href="#" onClick="myTree2.enableRTL(false)">Tree 2 - LTR</a></div>
<div><a href="#" onClick="myTree2.enableRTL(true)">Tree 2 - RTL</a></div>
</td>
</tr>
</table>
<p>dhtmlxTree supports both LTR and RTL text directions. LTR is set in the tree by default. To set RTL you should set the myTree.enableRTL() method to true, as it is mentioned below:</p>
</body>
</html>
Documentation
Check documentation to learn how to use the components and easily implement them in your applications.