3

这个问题中,Oleg 描述了如何从 jqGrid 的行 ID 中检索行数据。

在我的代码中,我想在 subGridRowExpanded 中显示有关一行的更多数据:

standardGrid.subGridRowExpanded = function (subgridId, rowId) {
    var dataFromTheRow = jQuery('#CompanyGrid').jqGrid('getRowData', rowId);
    var html = '<span style="padding-left:80px">' + dataFromTheRow.CompanyName + ' ' + 
        dataFromTheRow.StatusDesc + '</span>';
    $("#" + subgridId).html(html);
}

我的主网格列之一有一个自定义格式化程序,它返回格式化为链接的数据:

var colModel = [
    { name: 'CompanyID', label: 'Id', width: 30, align: "right" },
    { name: 'CompanyName', label: 'Company Name', search: true, formatter: CompanyLink },
    ...

function CompanyLink(cellValue, options, rowdata, action) {
    return '<a href="CompanyProfile.aspx?CompanyId=' + rowdata.CompanyID + '">' + 
            rowdata.CompanyName + '</a>';
}

当我使用上述答案检索数据时,它会以我的子网格格式、锚点和所有格式显示。我希望它只返回原始数据。

所以,我尝试向 col 模型添加一个 unformat 。基于自定义格式化程序代码,我添加了

function CompanyUnLink(cellValue, options) {
    return $(cellValue).text();
}

并将 CompanyName 行的 colModel 更改为

{ name: 'CompanyName', label: 'Company Name', search: true, formatter: CompanyLink, unformat: CompanyUnLink },

但是 unformat 例程传递了一个未使用锚格式化的 cellValue。

我将 unformat 更改为

function CompanyUnLink(cellValue, options) {
    // weird, the unformat actually passes in the raw data, and not the decorated one
    return cellValue;
}

它有效。但这对我来说似乎是错误的。有没有更好或更正确的方法来做到这一点?

下面是一个完整代码的小例子:

<table id="datalist"></table> 
<script type="text/javascript">
function CompanyLink(cellValue, options, rowdata, action) {
    return '<a href="CompanyProfile.aspx?CompanyId=' + rowdata.CompanyID + '">' + rowdata.CompanyName + '</a>';
}

function CompanyUnLink(cellValue, options, rowdata, action) {
    // weird, the unformat actually passes in the raw data, and not the decorated one
    return cellValue;
}


$("#datalist").jqGrid({
    datatype: 'local',
    colModel: [
                { name: 'CompanyID', label: 'Id', width: 30, align: "right" },
                { name: 'CompanyName', label: 'Company Name', search: true, formatter: CompanyLink },
            ],
    caption: "SubGrid Format Test",
    subGrid: true,
    subGridRowExpanded: function (subgridId, rowId) {
        var dataFromTheRow = $('#datalist').jqGrid('getRowData', rowId);
        var html = '<span style="padding-left:10px">' + dataFromTheRow.CompanyName + ' ' + dataFromTheRow.Info + '</span>';
        $("#" + subgridId).html(html);
    }
});

var mydata = [
        { CompanyID: 1, CompanyName: "Company1", Info: "Info on Company 1" },
        { CompanyID: 2, CompanyName: "Company2", Info: "Info on Company 2" },
        { CompanyID: 3, CompanyName: "Company3", Info: "Info on Company 3" },
        { CompanyID: 4, CompanyName: "Company4", Info: "Info on Company 4" },
    ];

for (var i = 0; i <= mydata.length; i++)
    $("#datalist").jqGrid('addRowData', i + 1, mydata[i]);

</script>

subGrid 行显示用锚点装饰的 CompanyName,即它不是原始行数据。

如果您更改 colModel 以调用 unformat 例程

    colModel: [
                { name: 'CompanyID', label: 'Id', width: 30, align: "right" },
                { name: 'CompanyName', label: 'Company Name', search: true, formatter: CompanyLink, unformat: CompanyUnLink },
            ],

文本不再装饰。但是 unformat 例程的 cellValue 是未经修饰的,这让我觉得是错误的。

4

0 回答 0