$(function(){
		$('#dg').datagrid({
			title:'test',
			view:detailview,
			remoteSort:false,
			singleSelect:true,
			nowrap:false,
			fit:true,
			fitColumns:true,
			url:'${pageContext.request.contextPath}/getPieTable',
			columns:[[
				{field:'area',title:'地區',width:163,align:'center'},
				{field:'time',title:'時間',width:100,sortable:true,align:'center'}
			]],
			 detailFormatter:function(index, row){
				 return '<div style="padding:2px"><table id="ddv-' + index + '"></table></div>';
			 },
			 onExpandRow:function(index,row){
	                $('#ddv-'+index).datagrid({
	                    url:'${pageContext.request.contextPath}/loadDetailView',
	                    fitColumns:true,
	                    singleSelect:true,
	                    height:'auto',
	                    columns:[[
	                        {field:'time',title:'時間',width:50,align:'center'},
	                        {field:'site',title:'地點',width:50,align:'center'},
	                        {field:'cost',title:'費用',width:50,align:'center'}
	                    ]],
			    //onresize 事件會在視窗或框架被調整大小時發生。
	                    onResize:function(){
	                        $('#dg').datagrid('fixDetailRowHeight',index);
	                    },
	                    onLoadSuccess:function(){
	                        setTimeout(function(){
				    //fixDetailRowHeight修復明細行高度
	                            $('#dg').datagrid('fixDetailRowHeight',index);
	                        },0);
	                    }
	                });
	                $('#dg').datagrid('fixDetailRowHeight',index);
	            }
		});
	});