1. 程式人生 > >關於EasyUI的Layout總結

關於EasyUI的Layout總結

1、layout以html標籤方式建立的

<div id="content" region="center" border="false" class="easyui-layout">
					
					<div id="divPage1"
						data-options="region:'west'"
						style="width: 150px;"></div>
					<div id="divPage2"
						data-options="region:'center',href:'${basePath}/userManage_main.jspx'"></div>
					
				</div>


這樣,如果我想重新修改 div id="divPage1"這個layout的href屬性,應該怎麼實行?

實現方法:

$("#divPage1").panel({region:'west',href:'${basePath}/userManage_left.jspx?width='+width});
$("#divPage1").panel('refresh');


必須執行panel的‘refresh’方法才會生效,因此這個‘userManage_left.jspx’頁面會被執行2次。目前我的解決辦法是使用js指令碼建立的方式來解決。

2、用js指令碼方式建立的

先建立一個div標籤,用於生成layout。

<div id="content" />

js指令碼建立

$('#content').layout('add',{   
				    region: 'west',   
				    width: 180,   
				    title: 'West Title',   
				    split: true,   
				    href:'${basePath}/userManage_left.jspx?width='+width,
				    tools: [{   
				        iconCls:'icon-add',   
				        handler:function(){alert('add')}   
				    },{   
				        iconCls:'icon-remove',   
				        handler:function(){alert('remove')}   
				    }]   
				});
				$('#content').layout('add',{   
				    region: 'center',   
				    width: 580,   
				    title: 'center Title',   
				    split: true,   
				    href:'${basePath}/userManage_main.jspx',
				    tools: [{   
				        iconCls:'icon-add',   
				        handler:function(){alert('add')}   
				    },{   
				        iconCls:'icon-remove',   
				        handler:function(){alert('remove')}   
				    }]   
				});