大家在项目中可能会经常用到DataGrid,普通的使用就是一个页面全是DataGrid,但是在实际开发中不可避免的遇到将页面分为上下部分,上面一部分就是提供查询条件,下面是datagrid,将通过查询条件查询出来的数据显示,对于我们这种前端菜鸟来说,这无疑是一件非常头疼的事情,那么我就分享一个简单的盒子上下分布的模型给大家
<div style="width:100%;height:100%;display:block;margin:-2px 0 0 -4px;"> <div class="easyui-layout" fit="true"> <div data-options="region:'north',border:true,iconCls:'icon-search'" style="height:132px;padding:5px 0px 0px 0px;"> 输入表号查询:<input id="biaohao"/> <button id="export" onclick="export2Excel()">导出到Excel表格</button> <button id="select" onclick="loadDataGrid()">查询</button> <br/> 开始时间:<input id="startTime" onClick="laydate()"/> 终止时间:<input id="endTime" onClick="laydate()"/> </div> <div data-options="region:'center',border:false" style="padding-top:4px;"> <table id="grid" fitColumns="true" region="center"></table> </div> </div> </div>