treegrid-3.0范例：基本功能

范例：基本功能

 

<input type="button" value="展开所有节点" onclick="_expandAll()">
<input type="button" value="折叠 所有节点" onclick="_collapseAll()">
<input type="button" value="显示数据池的数据" onclick="showPoolData()">

<br><br><div id="div1" style="width:850px;"></div>

<script language="javascript">
	var config = {
		"columns":[
			{"title": "组织名称", "field": "orgName"},
			{"title": "组织编号", "field": "orgCode", "align": "center", "width": "60"},
			{"title": "描述", "field": "orgDesc", "align": "center", "width": "100"},
			{"title": "操作人", "field": "operator", "align": "center", "width": "60"},
			{"title": "总人数", "field": "count", "align": "center", "width": "60"},
			{"title": "薪水", "field": "salary", "align": "center", "width": "60"}
		],
		"dataset":[
			{"id": 1,"orgName": "城区分公司", "orgCode": "CQ", "operator": "cjm", "count": 200, "salary": 3000.50, "children":[
				{"id": 5,"orgName": "城区卡品分销中心", "count": 100, "salary": 2000.00},
				{"id": 6,"orgName": "先锋服务厅", "count": 50, "salary": 1000.00, "children":[
					{"id": 7,"orgName": "chlid1", "count": 30, "salary": 1000.00},
					{"id": 8,"orgName": "chlid2", "count": 20, "salary": 900.00},
					{"id": 9,"orgName": "chlid3", "count": 20, "salary": 800.00, "children": [
						{"id": 10,"orgName": "chlid3-1", "count": 10, "salary": 500.00},
						{"id": 11,"orgName": "chlid3-2", "count": 10, "salary": 500.00},
						{"id": 12,"orgName": "chlid3-3", "count": 10, "salary": 500.00},
						{"id": 13,"orgName": "chlid3-4", "count": 10, "salary": 500.00}
					]}
				]},
				{"id": 14,"orgName": "半环服务厅", "count": 10, "salary": 500.00}
			]},
			{"id": 2,"orgName": "清新分公司", "orgCode": "QX", "operator": "", "count": 10, "salary": 500.00},
			{"id": 3,"orgName": "英德分公司", "orgCode": "YD", "operator": "", "count": 10, "salary": 500.00},
			{"id": 4,"orgName": "佛冈分公司", "orgCode": "FG", "operator": "", "count": 10, "salary": 500.00}
		]
	};

	var treeGrid = jQuery("#div1").showTreeGrid(config);
	
	function _expandAll(){
		treeGrid.expandAll();
	}
	
	function _collapseAll(){
		treeGrid.collapseAll();
	}

	function showPoolData(){
		jQuery("#textarea1").val(JSON.stringify(treeGrid.getDataPool()));
	}
</script>

<br><br><textarea id="textarea1" rows="20" cols="120"></textarea>