jQuery Tree

Set the height property of the jqxTree. Author: http://jqwidgets.com

by shubham sharma

HTML

<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<input type="text" id='text'/>
<input type='button' id='Add' value="Add"/>
<input class="pull-right" type='button' id='addAfter' value="Add After"/>
<input class="pull-right" type='button' id='addBefore' value="Add Before"/>
<input type='button' id="clear" value="Clear"/>
<p id='err'></p>
<div id='jqxWidget'>
    <div id='jqxExpander'>
        <div>
            Folders
        </div>
        <div style="overflow: hidden;">
            <div style="border: none;" id='jqxTree'>
            </div>
        </div>
    </div>
</div>

JavaScript

$(document).ready(function () {
    // Create jqxExpander
    $('#jqxExpander').jqxExpander({ showArrow: false, toggleMode: 'none', width: '500px', height: '370px'});
    // Create jqxTree
    var source = [
        {
            label: "Strategy & Business Intelligence", expanded: true, items: [
                { label: "Business Intelligence" , expanded: true, items: [
                    {label: "Customer Information Management"},
                    {label: "Data Analysis"}
                ]}
            ]
        },
        {
            label: "Technology Infrastructure", expanded: true, items: [
                { label: "System Engineering", expanded: true, items: [
                    { label: "Systems Operation & Administration" },
                    { label: "Business Operation" },
                    { label: "Business Process Management" },
                    { label: "Data Service Infrastructure" },
                    { label: "Database and Data Technology" },
                    { label: "Data Hub & Analytics" }
                ]},
                { label: "Business Intelligence", expanded: true, items: [
                    {label: "EDW"}
                ]},
                { label: "Enterprise Systems", expanded: true, items:[
                    { label : "Enterprise Applications" },
                    { label : "Business Process Management" }
                ]},
                { label: "Quality Assurance" },
                { label: "Shared Trading Services", expanded: true, items:[
                	{ label: "Business Operation" }
                ]}
            ]
        },
		{ label: "Risk", expanded: true, items:[
        	{ label: "IT Risk Management" },
            { label: "IT Compliance & Control" }
        ]},
        { label: "Technology Development", expanded: true, items:[
            
            { label: "ETCS & Retail Banking & Account Managament Services" },
            { label: "Digital Channels", expanded: true, items:[
    ...