[原创]EasyUI的Datagrid根据分辨率自适应宽度和高度

现在项目页面开发出来后，发现很多笔记本电脑中的分辨率低，造成原来固定了宽高的datagrid表格控件显示不全，导致用户体验很差的问题，今天终于得到解决

源代码如下：

<table id="grid" toolbar="#toolbar" style="width:200px;height:300px;"  url="/GoodsROM/ROMList" idField="id" treeField="Goods_Name">
 <thead>
 <tr>
 <th field="id" rowspan="2"width="0" hidden="true">id</th>
 <th field="_parentId" rowspan="2"width="0" hidden="true">id</th>
</tr>
</thread>
</table>
<div id="window" class="easyui-window" style="height:200px;width:300px;"></div>

修改后的代码：

<pre><table id="grid" toolbar="#toolbar" fit="true"   url="/GoodsROM/ROMList" idField="id" treeField="Goods_Name">
 <thead>
 <tr>
 <th field="id" rowspan="2"width="0" hidden="true">id</th>
 <th field="_parentId" rowspan="2"width="0" hidden="true">id</th>
</tr>
</thread>
</table>

<pre><div id=“window” style="height:200px;width:300px;"></div></pre>
</pre>

这样虽然解决了，datagrid的自适应问题但是，却发现出现了左下滚动条，说明还是有问题，于是继续将window的样式去掉，用js来制定它的宽和高，
代码如下：

<div id="window" class="easyui-window"></div>
<script>
$(function(){
$('#window').window({
width:300,
height:200
});
});
</script>

结果有些页面的确解决了问题，不再显示右下滚动条，但是有些页面还是存在滚动条，这是为什么呢，是因为datagrid的table和window的div没有分开在
不同的div中，导致页面加载时下方还是有一部分window的div也加载了，于是继续修改如下：

<pre><div style="width:100%;height:100%">
<table id="grid" toolbar="#toolbar" style="width:200px;height:300px;"  url="/GoodsROM/ROMList" idField="id" treeField="Goods_Name">
 <thead>
 <tr>
 <th field="id" rowspan="2"width="0" hidden="true">id</th>
 <th field="_parentId" rowspan="2"width="0" hidden="true">id</th>
</tr>
</thread>
</table>
</div>

<pre><div id="window"></div>