EasyUI使用心得——datagrid的查询功能和SubGrid冲突导致分页无效问题

在项目中使用easyui的datagrid也是有段时间了，easyui很方便确实，但是还是有些小问题，至少在我使用的过程中，发现的这些问题。
在datagrid使用SubGrid后，我在后面添加过滤功能。

$("#dg").datagrid('enableFilter');

很无奈，查询是出来，但是点击下一页数据却没有去服务端获取。
我将查询的代码放到SubGrid定义的前面，分页是正常了，但是查询确是失效了。
找了很多的原因，换过版本，用的官方demo的jQuery版本，等等还是不行。其实easyui的查询方法还真的很方便，很简单。无奈只能把查询删除，自己手动写。
下面是实现过程：
首先定义查询控件：

<form id="searchForm" style="padding: 0;margin: 0"> 
    <table border="0" width="100%">
        <tr style="height:30px">
            <td width="10%" style="text-align:right;border:0px">
                查询条件：
            td>
            <td width="15%" style="border:0px">
                <input class="easyui-textbox" name="变量名" id="变量名" style="width:100%"> 
            td>   

            <td width="10%" style="text-align:right;border:0px">
                查询条件：
            td>
            <td width="15%" style="border:0px">
                <input class="easyui-textbox" name="变量名" id="变量名" style="width:100%"> 

            td>   

            <td width="10%" style="text-align:right;border:0px">
                查询条件：
            td>
            <td width="15%" style="border:0px">
                <input class="easyui-textbox" name="变量名" id="变量名" style="width:100%"> 
            td>

            <td width="10%" style="text-align:right;border:0px">
                查询条件：
            td>
            <td width="15%" style="border:0px">
                <input class="easyui-textbox" name="变量名" id="变量名" style="width:100%"> 
            td>


        <tr style="height:30px">
            <td colspan="8" style="text-align:center;border:0px" >
                <a href="javascript:void(0)"  class="easyui-linkbutton" iconCls="icon-search" onclick="searchCase()" style="margin-right:20px"><strong>查询strong>a>          
                <a href="javascript:void(0)"  class="easyui-linkbutton" iconCls="icon-redo" onclick="resetSearch()" ><strong>重置strong>a>
            td>

        tr>                                               

    table>   
form> 

添加查询和重置方法：

//查询
function searchCase() {
    var param = new Object();   
    //获取查询条件
    var searchFormData = $("#searchForm").serializeArray();                
    $.each(searchFormData,function(i,v){
        param[v.name] = v.value;
    });

    //根据查询条件重新加载datagrid，这里会将查询的条件信息发送到后端，url是在datagrid定义时的url，只需在后端根据查询的添加获取相应信息返回即可。
    $('#dg').datagrid("reload", param); 

}

//重置查询
function resetSearch() {
    $("#searchForm").form("clear");
}