实现一个依赖 jqGrid答案

【问题标题】：Implementing a Dependent jqGrid实现一个依赖 jqGrid
【发布时间】：2014-04-26 18:58:30
【问题描述】：

我创建了一个 jqGrid，其中我有一个超链接列，单击时会获取数据并在父 Grid 下创建一个新的 jqGrid。

我的问题是，当我单击父网格的任何链接时，子网格创建成功。但在那之后，如果我点击任何其他链接，子网格会显示相同的数据。

问题是网格没有被新数据刷新。

我也试过jQuery('grid1').trigger('reloadGrid') 但这也不会改变任何事情。

编辑 *下面是调用父网格中元素的 onClick 的代码：*

var dynaData2   =   getDataForWelfareStatusDetails(memberId);
           jQuery('#grid1').jqGrid({
            datatype: 'local',
            data: dynaData2,
            colNames:['Effective Date ','Welfare Status ', 'State', 'IV-A/IV-E Case ID', 'Receipt No.','Case Type'],
            colMandReq:['-1','-1','-1','-1'],
            colModel: [
                   { name: 'effectiveDate',index:'effectiveDate', align:"center", editable:false,readonly:true,hidden:false, sortable:false, search: false},
                   { name: 'welfareStatus', index:'welfareStatus', align:"center", editable:false,readonly:true,hidden:false, sortable:false, search: false},
                   { name: 'stateCode', index:'stateCode', align:"center", editable:false,readonly:true,hidden:false, sortable:false, search: false},
                   { name: 'refCaseId', index:'refCaseId', align:"center", editable:false,readonly:true,hidden:false, sortable:false, search: false,formatter: returnCaseLink},
                   { name: 'receiptNum', index:'receiptNum', align:"center", editable:false,readonly:true,hidden:false, sortable:false, search: false},
                   { name: 'caseType', index:'caseType', align:"center", editable:false,readonly:true,hidden:false, sortable:false, search: false}

                   ],
            loadComplete: function() 
                {
                    jQuery('#grid1').trigger('reloadGrid');             
                },
            pager: '#pager1',
            gridview: true,
            rownumbers: false,
            autoencode: true,
            shrinkToFit: true,
            autowidth: true,
            sortable: false,
            height: '100%',
            rowNum: 100,
            caption:""
            });

欢迎和赞赏任何意见

【问题讨论】：

你能分享在链接点击时被调用的代码吗？
@MilindAnantwar：更新了我的问题，请检查
请分享你的示例代码的JsFiddle
何时触发此重载？
你的数据类型是json吗？确保loadonce: false.

标签： javascript jquery jqgrid

【解决方案1】：

试试这个，

jQuery("#grid1")
    .jqGrid('setGridParam',
        { 
            datatype: 'local',
            data:dynaData2
        })
    .trigger("reloadGrid");

或者你可以试试，

jQuery('#grid1').jqGrid("GridUnload");

看到这个DOCUMENTATION

【讨论】：

【解决方案2】：

首先是关于您的主要问题：为什么网格没有被新数据刷新？原因是：您尝试多次创建网格#grid1。这是不对的。在jQuery('#grid1').jqGrid({...}); 的第一次调用期间，最初的空<table id="grid1"></table> 将被转换为相对复杂的div 和表格结构。从结构中创建网格的第二次尝试将被忽略，并且您看不到网格的刷新。

您可以通过多种方式修复代码。如果包含jQuery('#grid1').jqGrid("GridUnload");，您将获得最小的代码，但不是最好的代码。

您应该以任何方式从loadComplete 或jQuery('#grid1') 中删除jQuery('#grid1').trigger('reloadGrid');。回调loadComplete 将在加载或重新加载网格期间处理。所以你可以进行递归。

另一种可能性是将网格的初始创建和网格内容的稍后刷新分开。使用代码jQuery('#grid1').jqGrid({...});，您可以创建网格。要刷新您需要的数据 1) 删除网格的旧数据 2) 例如针对 setGridParam 设置新数据 3) 针对 trigger("reloadGrid") 重新加载网格。

您没有发布onClick 部分。我建议您使用the answer（或this one）中描述的方法，它使用beforeSelectRow 回调而不是设置多个click 句柄。

【讨论】：