如何解决:jqGrid根据Form自定义条件加载服务器返回的json对象

[pingjing_82]

条件界面如下:条件可以自定义,可增加任意多个条件


条件设置完以后,点查询按钮,从服务器获取json填充到jqGrid中


第一次加载有效,可是另外设置不同的条件后,再点查询就无效了,还是显示第一次的结果.
结过测试,服务器端返回的json数据是正确的.为什么第二次不能加载到jqGrid中.

js代码:

$.post("EngineTestSearchData.ashx", $("#Form1").serialize(), function (json) {
json = eval("(" + json + ")");
$("#jqgrid1").jqGrid({
    datatype: 'local',
    data: json.rows,
    rowNum: 20,
    pager: '#pager1',
    colNames: ['ID', '日期', '发动机编号', '台架号'],
    colModel: [
        { name: 'ID', index: 'ID', width: 55 },
        { name: '日期', index: '日期', width: 90, formatter: 'date' },
        { name: '发动机编号', index: '发动机编号', width: 100 },
        { name: '台架号', index: '台架号', width: 80, align: "right" }                               
         ],
     width: 1000,
        rowList: [10, 20, 30],
        viewrecords: true
}).trigger("reloadGrid");
});

html代码:

<div id="tabs-1">
        <table border="1" style="border-collapse:collapse" id="tbl_condition" >
        <thead>
            <tr align="center" style="background-color: #E7F7FF; color: #217BAD;">
            <th>左括号</th>
            <th>条件名称</th>
            <th>运算符</th>
            <th>值</th>
            <th>右括号</th>
            <th>关系</th>  
            <td align="center"><a href="#" id="getAtr"><span style="color: #000">增加条件</span></a></td>
            </tr>
            </thead>
            <tfoot> </tfoot>
        <tbody id="addTr" class="style3">
            <tr align="center">
            <td>
                <input type="text" name="Lkuoh" class="style3" style="width:40px" value="("/></td>
            <td><select name="condition" onchange="sel_Onchange(this)" class="style3"></select></td>
            <td><select name="fh" class="style3"></select></td>
            <td>
                <input  type="text" name="value1" class="style3" /></td>
            <td>
                <input type="text" name="Rkuoh" class="style3" style="width:40px" value=")"/></td>
            <td><select name="relation" class="style3" ></select></td>   
            <td></td>
            </tr>
        </tbody>
            <tr class="style3">                      
            <td colspan="7" style="text-align:center">
                <input id="Button1" type="button" value="查询" />
                </td>
            </tr> 
        </table> 
</div>

<div id="tabs-2">
        <table id="jqgrid1"></table>
        <div id="pager1"></div>
</div>

[pingjing_82]

根据showbo版主说的,还是不成功.

[pingjing_82]

代码改成这样子还是不行

 $("#jqgrid1").jqGrid({
   url: "EngineTestSearchData.ashx",
   datatype: 'json',
   loadonce: true,
   mtype: 'POST',
   rowNum: 20,
   pager: '#pager1',
   postData: $("#Form1").serialize(),
   jsonReader: {
         root: function (json) {
         var rows = json.rows;
         return json.rows;
      }
   },
   colNames: ['ID', '日期', '发动机编号', '台架号'],
   colModel: [
   	{ name: 'ID', index: 'ID', width: 55 },
   	{ name: '日期', index: '日期', width: 90, formatter: 'date' },
   	{ name: '发动机编号', index: '发动机编号', width: 100 },
   	{ name: '台架号', index: '台架号', width: 80, align: "right" }
   ],
   width: 1000,
   rowList: [10, 20, 30],
   viewrecords: true
}).trigger("reloadGrid");

调试的变量显示如下图,json格式应该没有问题的.

然后报异常:

[Go 旅城通票]

jsonReader: {
         root: "rows"
   },

这样就行了吧。。$(function(){})中初始化一次jqgrid就行了。。其他调用setGridParam

 $("#jqgrid1").setGridParam({
  url:"EngineTestSearchData.ashx",
   postData: $("#Form1").serialize()
     }).trigger('reloadGrid');

[Go 旅城通票]

好像远程数据可以。。

 $('#tblData').setGridParam({
  url:"EngineTestSearchData.ashx?"+ $("#Form1").serialize(), 
  datatype:'json',  
     });
     $('#tblData').trigger('reloadGrid');

[pingjing_82]

还是不成功,难道真没有办法了?

[pingjing_82]

初始化的代码如下:

//jqGrid初始化
        function InitJqgrid() {
            $("#datatable1").jqGrid({
                //url: "EngineTestSearchData.ashx",
                datatype: "local",
                //postData: $("#Form1").serialize(),
                mtype: "POST",
                height: 45,
                width: 1000,
                rowNum: 20, //每页的记录数
                pgtext: "第{0}页 共{1}页",
                pgbuttons: true,
                autoheight: true,
                rownumbers: false, // 是否显示行数
                pgbuttons: true, // 分页按钮是否显示
                pginput: true, // 是否允许输入分页页数
                scrollrows: false, // 是否显示行滚动条
                viewrecords: true, // 是否显示总记录数
                multiselect: true, // 是否显示复选框
                recordpos: "left", // 记录数显示位置
                sortorder: "asc", //排序方式
                pager: "#Pager",
                colNames: ['ID', '日期', '发动机编号','故障阶段', '故障描述', '是否旧机', '故障类型', '故障模式', '故障总成件', '故障件图号', '厂家代码', '数量', '初步故障分析', '返修处理', '责任单位'],
                colModel: [
   		                { name: 'ID', index: 'ID', width: 55 },
   		                { name: '日期', index: '日期', width: 90 },
   		                { name: '发动机编号', index: '发动机编号', width: 100 },
                        { name: '故障描述', index: '故障描述', width: 80, align: "right" },
                        { name: '试机处理', index: '试机处理', width: 80, align: "right" },
                        { name: '是否旧机', index: '是否旧机', width: 80, align: "right" },
                        { name: '故障类型', index: '故障类型', width: 80, align: "right" },
                        { name: '故障模式', index: '故障模式', width: 80, align: "right" },
                        { name: '故障总成件', index: '故障总成件', width: 80, align: "right" },
                        { name: '故障件图号', index: '故障件图号', width: 80, align: "right" },
                        { name: '厂家代码', index: '厂家代码', width: 80, align: "right" },
                        { name: '数量', index: '数量', width: 80, align: "right" },
                        { name: '初步故障分析', index: '初步故障分析', width: 80, align: "right" },
                        { name: '返修处理', index: '返修处理', width: 80, align: "right" },
                        { name: '责任单位', index: '责任单位', width: 80, align: "right" }
   	                    ]
            });
        }

设置参数的代码如下:

$("#datatable1").jqGrid('setGridParam', {
                        url: "EngineTestSearchData.ashx",
                        postData: $("#Form1").serialize(),
                        datatype: 'json'
                    }).trigger("reloadGrid");

[pingjing_82]

感谢,我先试一下,成功了再来结贴.

[Evangeline_C]

我最近好像也是这个问题，不过不是search的原因，是用setGridParam设置了postData没有办法reloadGrid，但是打开网页第一次加载表格的时候设置的postdata就可以正确传给后台并返回数据。很苦恼啊，不知你这个问题当时解决了没有。最后怎么解决的呢？？是7楼那个方法吗？