Accordion Tools

Click the tools on top right of panel to perform actions.

示例：

代码：

					
<div id="aaa" style="width:500px;height:300px;">
	<div title="About" data-options="iconCls:'icon-ok'" style="overflow:auto;padding:10px;">
		<h3 style="color:#0099FF;">Accordion for jQuery</h3>
		<p>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</p>
	</div>
	<div title="Help" data-options="iconCls:'icon-help'" style="padding:10px;">

		<table id="dg2" class="easyui-datagrid" 
				data-options="url:'examples/accordion/datagrid_data1.json',method:'get',fit:true,fitColumns:true,singleSelect:true">
			<thead>
				<tr>
					<th data-options="field:'itemid',width:80">Item ID</th>
					<th data-options="field:'productid',width:100">Product ID</th>
					<th data-options="field:'listprice',width:80,align:'right'">List Price</th>
					<th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
					<th data-options="field:'attr1',width:150">Attribute</th>
					<th data-options="field:'status',width:50,align:'center'">Status</th>
				</tr>
			</thead>
		</table>
	</div>
	<div title="DataGrid" style="padding:10px" data-options="
			selected:true,
			tools:[{
				iconCls:'icon-reload',
				handler:function(){
					$('#dg').datagrid('reload');
				},
				onSelect:function(title,index){
					console.log(title,index);
				}
			}]">
		<table id="dg" class="easyui-datagrid" 
				data-options="url:'examples/accordion/datagrid_data1.json',method:'get',fit:true,fitColumns:true,singleSelect:true">
			<thead>
				<tr>
					<th data-options="field:'itemid',width:80">Item ID</th>
					<th data-options="field:'productid',width:100">Product ID</th>
					<th data-options="field:'listprice',width:80,align:'right'">List Price</th>
					<th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
					<th data-options="field:'attr1',width:150">Attribute</th>
					<th data-options="field:'status',width:50,align:'center'">Status</th>
				</tr>
			</thead>
		</table>
	</div>
</div>
<script type="text/javascript">
	$(function(){
		$('#aaa').accordion({    
		    onSelect:function(title,index){
				console.log(title,index);
			}  
		});  


	})
</script>