Jquery 网格仅在第一次单击时加载，后续单击时不会重新加载

Question

我有一个

JQuery

网格，根据某些下拉选择，单击按钮即可填充该网格。

第一次单击按钮时网格就会加载数据。但在随后的单击中，网格不会根据更改的下拉选择重新加载。

单击第一个按钮时加载的网格数据将持续存在，直到并且除非我重新加载页面。

我在网上查了一些解决方案，例如

1. 使用

   $("#tblJQGrid").trigger("reloadGrid");

   进行后续点击（第一次点击除外）

2. cache:false

   属性。

但是它们都不起作用。

这是我的

jqgrid

代码供参考

function BindGridData()
{
    $("#tblJQGrid").jqGrid(
            {url: "@Url.Action("GetGeographyBreakUpData", "GeoMap")"+ "?Parameters=" + Params + "",
                datatype: "json",
                //data: { "Parameters": Params },
                async: false,
                mtype: 'GET',
                cache: false,
                colNames: ['Id','GeoGraphy', 'Completed', 'InProgress'],
                colModel: [
                { name: 'Id', index: 'Id', width: 20, stype: 'text',hidden:true },
                { name: 'Geography', index: 'Geography', width: 150 },
                { name: 'Completed', index: 'Completed', width: 150 },
                { name: 'InProgress', index: 'InProgress', width: 150 },
                ],
                pager:'#pager',
                jsonReader: {cell:""},
                rowNum: 10,
                sortorder: "desc",
                sortname: 'Id',
                viewrecords: true,

                caption: "Survey Status:Summary",
                scrollOffset: 0});

 }

这是我初始化按钮单击事件的方式

$(document).ready(function () {
var firstClick=true;
        $("#btnSubmit").click(function(){
            btnSubmitClick();
            debugger
            if(!firstClick)
            {
                $("#tblJQGrid").trigger("reloadGrid");
            }
            firstClick=false;
            BindGridData();
        });
});

有人可以告诉我我做错了什么吗？

Answer 1

似乎对代码

$("#tblJQGrid").jqGrid({...});

的作用存在典型的误解。这是“创建”网格。这意味着将空表<table id="btnSubmit"></table>转换为相对复杂的div和table结构。请参阅

此处

。了解了这一点后，应该清楚第二次调用BindGridData没有任何意义，因为

table#btnSubmit

并不更空。 jqGrid 对其进行了测试，但什么也不做。因此，您当前的代码只需使用

旧

URL 触发

reloadGrid

（请参阅 Params）。要解决此问题，您有两个主要选择：

用法

url: "@Url.Action("GetGeographyBreakUpData", "GeoMap")"
1. 和

   postData

   ，其属性定义为

   functions

   （参见 旧答案） 单击
重新创建网格，而不是
2. 触发 reloadGrid。您可以在调用

   GridUnload

   之前调用

   BindGridData

   方法（参见 旧答案）。

Answer 2

如果使用按钮，请使用以下代码片段

 $("#btnSubmit").click(function(){
    $('#tblJQGrid').jqGrid('GridUnload');
    BindGridData();
  });

如果使用下拉菜单，请使用以下代码片段，

$("#btnSubmit").change(function(){
   $('#tblJQGrid').jqGrid('GridUnload');
   BindGridData();
  });