easyui的datagrid自适应排版

在使用的easyui排版的时候,经常会使用到datagrid,如果页面只有一个datagrid,只需要设置fit=true就可以了,例如:

	<div class="easyui-panel" title="角色授权" fit=true>
	    <table id="t_jssq" fit="true"></table>
	</div>
如果datagrid的上面还需要显示一些信息,如果按照下面的写法:

	<div class="easyui-panel" title="角色授权" fit=true>	
	     角色:${requestScope.mc}		
	    <table id="t_jssq" fit="true"></table>
	</div>
发现,datagrid下面的翻页等信息被挤没了。

处理方法有两个:

方法一:datagrid放弃自适应,给datagrid设定固定高度:

	<div id="gn" class="easyui-panel" title="角色授权" fit=true>	
		<div style="padding:10px;">	
			角色:${requestScope.mc}
		</div>		
		<table id="t_jssq"></table>
	</div>
方法二:将datagrid装在layout中:

   <div  class="easyui-layout"  data-options="fit:true">
         <div data-options="region:'north'" title="角色授权" style="height:60px;padding:5px;">
                 角色:${requestScope.mc}
         </div>
         <div data-options="region:'center'">
                <table id="t_jssq" fit="true"></table>
         </div>
    </div>
依然可以装在panel里:

     <div  class="easyui-panel" title="角色授权" fit=true>	
    	<div  class="easyui-layout"  data-options="fit:true">
        	 <div data-options="region:'north'"  style="height:30px;padding:5px;">
                 	角色:${requestScope.mc}
         	</div>
         	<div data-options="region:'center'">
                <table id="t_jssq" fit="true"></table>
         	</div>
    	</div>
     </div>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值