easyUI datagrid数据表格根据窗口大小自动调节表格的高度和宽度

1. 先写一个自定义的函数

//datagrid宽度高度自动调整的函数
$.fn.extend({
    resizeDataGrid: function (heightMargin, widthMargin, minHeight, minWidth) {
        var height = $(document.body).height() - heightMargin;
        var width = $(document.body).width() - widthMargin;
        height = height < minHeight ? minHeight : height;
        width = width < minWidth ? minWidth : width;
        $(this).datagrid('resize', {
            height: height,
            width: width
        });
    }
});

2. 页面初始化的时候加入如下代码

$(document).ready(function(){
    //这里写的边界高度可以把头部和底部的高度加上
    var heightMargin = 0;
    //如果有左侧导航也可以添加宽度边界
    var widthMargin = 0;
    // 第一次加载时和当窗口大小发生变化时，自动变化大小
    $('#grid').resizeDataGrid(heightMargin, widthMargin, 200, 200);
    //窗口大小改变时，调用
    $(window).resize(function () {
        $('#grid').resizeDataGrid(heightMargin, widthMargin, 200, 200);
    });
    //这里的200是设置的最小宽度和高度
});