Focus item

dhtmlxTree allows you to select and scroll to the indicated item from the script. Choose the number of the node you want to scroll to in the selection list and click on the action link.

focus

</> Source

<!DOCTYPE html>
<!--pro-->
<html>
<head>
	<title>Focus item</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;
		function doOnLoad(){
			myTree = new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
			myTree.setImagePath("../../../skins/web/imgs/dhxtree_web/");
			myTree.load("../common/tree_lg.xml");
		}
	</script>
</head>
<body onload="doOnLoad()">
	<h1>Focus item</h1>
	<p>dhtmlxTree allows you to select and scroll to the indicated item from the script. Choose the number of the node you want to scroll to in the selection list and click on the action link. </p>
	<table>
		<tr>
			<td>
				<div id="treeboxbox_tree" class="tree_demo_samples"></div>
			</td>
			<td rowspan="2" style="padding-left:25px" valign="top">
				<select id="sel1">
					<option value="10">0<option value="1">1<option value="2">2<option value="3">3
					<option value="4">4<option value="5">5<option value="6">6<option value="7">7
					<option value="8">8<option value="9">9
				</select>
				<a href="javascript:void(0)" onClick="var z=document.getElementById('sel1').value; myTree.selectItem(z); myTree.focusItem(z); "> focus </a>
			</td>
		</tr>
	</table>
</body>
</html>

Documentation

Check documentation to learn how to use the components and easily implement them in your applications.