排序或过滤后丢失的免费jqgrid自定义格式化程序

时间:2016-03-07 09:49:51

标签: jqgrid free-jqgrid jqgrid-formatter

我正在使用免费的jqgrid 4.13.0

我编写了一个自定义格式化程序,但不幸的是,在对表或过滤进行排序后,该列的单元格内容总是丢失。我可能在格式化程序函数中做错了,但还没有真正理解缺少的东西。有谁能发现我的错误?为什么它与内置的工作正常,但不与我的。我受到了这个启发:http://www.ok-soft-gmbh.com/jqGrid/CascadingFormater.htm

我可以看到示例如何调用$.fn.fmatter.call,也许我也需要这样做。这是关键吗?不幸的是,如果我自己编写函数,我找不到任何关于如何执行此操作的文档。

这是我的设置:

var formatEnduser = function (cellValue, options, rowObject, action){
    return rowObject.so_enduser_id == undefined ? '' : '<a href="index.php?module=Accounts&view=Detail&record='+rowObject.so_enduser_id+'">'+rowObject.so_enduser_name+'</a>';
}

$("#jqGrid").jqGrid({
    datatype: "jsonstring",
    datastr: jsonData,
    jsonReader: {
        root: 'rows',
        id: 'crmentity_id',
        repeatitems: false,
        page:  function(obj) { return 1; },
        total: function(obj) { return 1; },
        records: function(obj) { return obj.rows.length; },
    },
    autowidth: true,
    height: 600,
    shrinkToFit: true,
    rownumbers: true,
    rowNum: 5,
    pager: false,
    loadonce: true,
    viewrecords: true,
    colModel: [
        {
            name: 'crmentity_id',
            key: true,
            hidden: true
        },
        {
            label: 'Enduser',
            name: 'so_enduser_name',
            searchoptions: {
                sopt : ['cn']
            },
            formatter: formatEnduser
        },
    ]
});
$('#jqGrid').jqGrid('filterToolbar');

对象jsonData如下所示:

Object { rows=[623],  so_total_total=4321, in_total_total=1234 }

在属性rows中可以找到:

[Object { crmentity_id="60199",  so_enduser_id="6808",  so_enduser_name="enduser123",  mehr...}, Object { crmentity_id="60136",  so_enduser_id="6362",  so_enduser_name="userend321",  mehr...}, 620 mehr...]

非常感谢您的帮助!

编辑:我添加了一个jsfiddle来演示问题,在过滤器中搜索end并查看数据是如何消失的。排序也是如此。 http://jsfiddle.net/tztj9yn7/2/

1 个答案:

答案 0 :(得分:5)

主要问题是您的代码如下。您使用datatype: "jsonstring"并且自定义格式化程序使用输入数据的属性so_enduser_id,但该属性不是网格的列。数据类型"jsonstring"的处理方式与数据类型"json"(或“jsonp”或"xml")的处理方式相同。它将由jqGrid读取并仅在本地保存colModeljsonReader.id中的列。因此,仅在初始读取网格期间,so_enduser_id 中的输入数据的属性rowObject才可用。到目前为止我写的所有内容对于旧的jqGrid和免费的jqGrid都是一样的。

如果使用旧jqGrid ,有两种方法可以解决问题:

  • 使用name: "so_enduser_id"
  • 添加隐藏列
  • datatype: "jsonstring", datastr: jsonData替换为datatype: "local", data: jsonData.rows,并将jsonReader替换为localReader: { id: 'crmentity_id' }。如果使用datatype: "local",输入数据将与所有属性一起保存(就像在输入中一样)并且问题将得到解决。

如果您需要直接从URL加载数据,那么第二种方式(datatype: "local")将无法使用,唯一的方法是使用稍后需要的所有属性的隐藏列。 / p>

免费的jqGrid为您提供了另一种非常简单的方法:使用additionalProperties选项。 additionalProperties的想法非常简单。有时需要从输入数据的每个项目中保存一些附加属性以便稍后在本地使用(因为使用了loadonce: true)。将数据保存在DOM中比在JavaScript结构中保存数据要昂贵得多。可以使用像additionalProperties: ["crmentity_id", "so_enduser_id"]这样的选项来通知免费的jqGrid读取其他一些属性并在本地保存。因此,您的代码将立即修复:请参阅http://jsfiddle.net/tztj9yn7/3/

关于在免费jqGrid中使用自定义格式化程序的一个更重要的建议。 rowObject参数存在一些重要问题。它只是输入项与源中的完全相同。因此,如果您使用datatype: "xml"作为示例,那么rowObject参数将是XML节点。同样,如果您使用repeatitems: true格式(["60199", "6808", "enduser123"]而不是{crmentity_id:"60199", so_enduser_id:"6808", so_enduser_name:"enduser123"}),那么您必须使用rowObject[1]代替rowObject.so_enduser_id来访问来自初始输入数据的属性so_enduser_id。在下一次排序或过滤时,您将拥有 rowObjectrowObject.so_enduser_id)的另一种格式,因为输入数据将是来自本地data参数的数据。免费的jqGrid仍使用相同格式的rowObject参数来提供与旧版jqGrid的最佳兼容性,但它设置了rowData另外 options属性参数。 options.rowData具有始终确定性命名的数据格式,并且可以使用始终options.rowData.so_enduser_id独立于输入数据的格式和使用的datatype。因此, options.rowData是访问输入数据的首选方式。根本不应该使用第三个参数。格式化程序的结果代码将是

var formatEnduser = function (cellValue, options) {
        var item = options.rowData;

        return item.so_enduser_id == undefined ?
                '' :
                '<a href="index.php?module=Accounts&view=Detail&record=' +
                    item.so_enduser_id + '">' + item.so_enduser_name + '</a>';
};

请参阅http://jsfiddle.net/tztj9yn7/4/