【问题标题】:jqGrid: subgrid doesn't populate with datajqGrid:子网格不填充数据
【发布时间】:2011-09-21 12:58:18
【问题描述】:

我有一个子网格,当您单击“Cheese”旁边的“+”号时,将触发 ajax 查询,我会看到子网格列名称,但实际数据并未填充到子网格中。无论我尝试扩展哪个网格,都会出现问题,但“奶酪”示例如下所示。

您可以在屏幕截图的 FireBug 输出的底部看到 XML 响应。我已经通读了那个 XML,它看起来是有效的。凭直觉,我还将 XML 输出粘贴到this page,它似乎缩进就好了。最重要的是,我还让 ajax 调用返回了一些非常基本的值,无论我到目前为止尝试了什么,网格仍然是空的。

您应该在子网格中看到的是:

------------------------------------------------------
|Translations                    | Language | Active |
------------------------------------------------------
| It's cheesy goodness           |   EN     |   No   |
| fromage                        |   FR     |   No   | 
|                                |   DE     |   N/A  |   <-- "N/A" means there's no translation of "cheese" in German, currently in the database

    ... etc., with all supported languages listed.

子网格的代码是:

$("#translationsList").jqGrid({
    caption : "Translations",
    datatype : "xml",
    url : translationsFeed,
    editurl : translationsEdit,
    mtype : "get",
    pager : "#translationsPager",
    rowNum : 20,
    autowidth : true,
    sortname : "phrase",
    sortorder : "asc",
    viewrecords : true,
    multiselect : false,
    hidegrid : false,
    height : 300,
    altRows : true,
    rownumbers : true,
    toolbar : [false],
    colNames : ["phrase_id", "translation_id", "language_cd", "Phrase", "Translation", "Created", "Modified", "Active"],
    colModel : [
            { name : "phrase_id",                                   index : "phrase_id",            sortable : true,    search : false, editable : true,    edittype : "text",      editrules: { edithidden :true },                                    hidden : true},
            { name : "translation_id",                          index : "translation_id", sortable : false, search : false, editable : true,    edittype : "text",      editrules: { edithidden :true },                                    hidden : true},
            { name : "language_cd",                                 index : "language_cd",      sortable : true,    search : true,  editable : true,    edittype : "text",      editrules: { edithidden: true, required : true }, hidden : true },
        { name : "Phrase",              width:200,  index : "phrase",               sortable : true,    search : true,  editable : true,    edittype : "text",      editrules: { required : true } },
        { name : "Translation",         width:200,  index : "translation",      sortable : true,    search : true,  editable : true,    edittype : "text",      editrules: { required : false } },
        { name : "Created",             width:100,  index : "modify_dt",            sortable : true,    search : true },
        { name : "Modified",            width:100,  index : "create_dt",            sortable : true,    search : true },
        { name : "Active",              width:20,       index : "active",               sortable : true,    search : true,  editable : true,    edittype : "select",    editoptions:{value:"0:No;1:Yes"} }
    ],
    onSelectRow: function(id) {
            jQuery('#translationsList').editRow(id, true);
    },
    subGrid: true,
    subGridUrl: 'ajax/translations_subgrid_feed.php',
    subgridtype: 'xml',
    subGridModel : [{
      name      : ['Translations', 'Language', 'Active'],
      width     : [583, 70, 80],
      align     : ['left','right','right'],
      params    : ['phrase_id']
    }],
  subGridOptions: {
    plusicon : "ui-icon-plus",
    minusicon : "ui-icon-minus",
    openicon: "ui-icon-carat-1-sw",
    expandOnLoad: true,
    selectOnExpand : false,
    reloadOnExpand : true
  }
});

主/子网格的 XML 响应可以在 this Gist 中找到

【问题讨论】:

  • 您能否在单击“Cheese”后发布来自translationsFeed URL 的XML 响应和子网格“ajax/translations_subgrid_feed.php”的XML 响应?基于图片的 XML 类型不是很好的工作。拥有两种 XML 可以轻松重现您的问题。
  • 当然:gist.github.com/1043635 我也将它添加到了问题的末尾。

标签: jqgrid subgrid


【解决方案1】:

我可以重现该问题并分析了 jqGrid 的 subgrid 模块的代码。我的解释是:您使用的subGridOptions 的新expandOnLoad: true 属性只能在主网格上的“本地”数据类型的情况下工作。我在文档中没有找到关于此的相应备注,但确实如此。

在 4.1 版本中使用了delayOnLoad 选项,但它没有正确工作。在 4.1.1 版本中,在 the fix 之后不使用该选项,并且在主网格中添加一行之后立即使用该选项。问题是jqGrid使用.grid.hDiv.loading属性来跳过ajax请求,如果之前的ajax请求的响应没有被处理到最后。在主网格的$.ajax 请求的beforeSend 处理程序内部(请参阅here)将被称为beginReq(),第一行是

ts.grid.hDiv.loading = true;

然后在$.ajax 请求的success 处理程序内部,将调用addXmlData 方法,该方法为主网格的每一行调用addSubGrid,在“展开”图标上调用.trigger('click');网格行。因此,populatesubgrid 将在所有网格行上调用,然后.grid.hDiv.loading 将在endReq 内部在success 处理程序结束时更改为false。因此,在populatesubgrid 方法的相应部分中,ts.grid.hDiv.loading 将被测试相应的$.ajax 调用将被跳过并且行将不会展开

所以我可以重复我的分析的简短结果:不要使用expandOnLoad: true 选项。它不适用于远程数据。

【讨论】:

  • 所以,我从中收集到的是:(1)不要对远程数据使用“expandOnLoad:true”(我已将其更改为 false),以及(2)确保我正在使用最新版本的 jqGrid。这两个步骤加在一起没有任何变化。您能否发布您的工作代码示例,以便我可以将其与我所拥有的进行比较?感谢您抽出宝贵时间对此进行调查!
  • @normalocity:没问题。看here
  • 嗯,我一定有其他问题。我修改了我的页面以匹配你的,它仍然有同样的问题。然后,我创建了一个新页面,其中包含您页面中的确切 HTML,并调整了我的网格/子网格 URL 以指向我的文件,但我仍然遇到同样的问题。我还逐行将我的 jqGrid 代码与您的代码进行了比较,但仍然不行。但是,您发布的代码/页面示例非常有效。
  • 接下来我要做的就是复制你的 XML 文件,然后再次测试。
  • 好的,我的 XML 或发送响应的方式似乎有问题。我为子网格插入了你的 XML 文件,然后 BINGO!
猜你喜欢
  • 1970-01-01
  • 2021-05-31
  • 2011-04-24
  • 1970-01-01
  • 1970-01-01
  • 2012-12-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多