0

将 jqGrid 与可编辑单元格(选项中的 cellEdit:true)和根据单元格值返回图像的自定义格式化程序一起使用时,我的 Web 应用程序出现问题。

当单击一个单元格时,不是在图像本身上,单元格编辑就像一个魅力。但是,当单击图像本身时,您会遇到声称找不到 parentNode 的 JavaScript 错误。

我没有深入研究这个问题,但我想这与 jqGrid 如何使用自定义格式化程序应用图像,或者它如何尝试获取 parentNode 有关。

无论如何,通过在图像本身上指定一个 onclick-event 来调用它的 parentNode 并单击它,可以避免错误。

例如,规避此错误的简单自定义格式化程序是:

function booleanFormatter(cellvalue, options, rowObject){
    if (cellvalue == true){
        return '<img src="checked.png" onclick="this.parentNode.click();"/>';
    }
    else if (cellvalue == false){
        return '<img src="notchecked.png" onclick="this.parentNode.click();"/>';
    }
    else {
        return '';
    }
}

使用格式化程序的 colmodel 的摘录可能是:

colmodel: [ { name: 'CheckableCell', index: 'CheckableCell', editable: true, formatter: booleanFormatter}]
4

1 回答 1

0

是的,或者您可以以更隐蔽、类似 jQuery 的方式完成相同的结果。首先,将格式化程序函数更改如下:

function booleanFormatter(cellvalue, options, rowObject){
    if (cellvalue == true){
        return '<img src="checked.png" class="imgclickable"/>';
    }
    else if (cellvalue == false){
        return '<img src="notchecked.png" class="imgclickable"/>';
    }
    else {
        return '';
    }
}

接下来,将其添加到网格本身的属性列表中(将函数附加到网格的 gridComplete 事件):

gridComplete: function() {
    jQuery('.imgclickable').click(function() {
        this.parentNode.click();
    });
}
于 2011-07-04T17:09:35.570 回答