easyui布局:表格底部页码被遮挡

问题图片：

由于在布局中，表格上面有操作按钮，导致表格底部的页码无法固定在底部。

解决方式：
正确使用easyui layout
问题代码：

  <div data-options="collapsible:true,dosize:true,split:true" class="easyui-panel table-layout" title="demo表格"  style="height:75%;width:100%">
           自行添加了div进行布局的扩充
        <div class="columns" >
          <button type="button" class="btn  btn-primary btn-sm" onClick="add()">
            <i class="fa" aria-hidden="true"></i>添加
          </button>
          <button type="button" class="btn  btn-danger btn-sm" onclick="batchRemove()">
            <i class="fa" aria-hidden="true"></i>删除
          </button>
       </div>
        自行添加了div进行布局的扩充
         <table id="jxNotify"  >
        中间省略
          </table >
   </div> 

按钮那一行是自己多添的，造成下面的高度超出了窗体高度,分页显示不全。

正确的实现方式：

<div class="easyui-layout">
    <div data-options="region:'north'" style="height:100px">
        <!-- 官方文档写的清楚，没说清楚 -->
        <!-- 我的理解是这里面不能有自己的结构，如果需要插入更多的内容，
        请再用div class="easyui-layout"包起来，里面再分区，
        如果上中下左右还不能满足，那么就再包一层 -->
        <div class="easyui-layout" data-options="fit:true">
            <div data-options="region:'north',collapsed:true" style="width:180px">
               自己要添加的内容。包裹起来，本文最开始的两个表格操作按钮就放在此处即可实现
            </div>
            <div data-options="region:'center'">
                <table id="datagrid2"></table>
            </div>
        </div>
    </div>

</div>

最后实现后的效果：