Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jqGrid: mess when cellattr returning string containing "style"

Background:

I've encountered strange behavior in jqGrid: when cellattr callback returns string containing "style" the grid gets messed.

Please see an example:

HTML:

<table id="grid"></table>

Javascript:

$("#grid").jqGrid({
    datatype: "local",
    height: "auto",
    data: [{column1: "row1col1", column2: "row1col2" },
        {column1: "row2col2", column2: "row2col2" }],
    colNames: ['Column1', 'Column2'],
    colModel: [
    {
        name: 'column1',
        index: 'column1',
        cellattr: function (rowId, val, rawObject, cm, rdata) {
            attrValue = (rawObject.column2 == 'row2col2') ? 'GangnamStyleAttribute' : 'GangnamAttribute';
            return ' customAttr="' + attrValue + '"';
        },
        width: 100
    },
    {
        name: 'column2',
        index: 'column2',
        width: 100
    }],
    caption: "Stack Overflow Example",
});

$("#grid").jqGrid('setGridParam');

Also please see a jsfiddle

In the example above cellattr returns ' customAttr="GangnamAttribute"' for the first row and ' customAttr="GangnamStyleAttribute"' for the second row.

As you can see from jsfiddle, the first row is displayed correctly, but the second one is messed up: the first column is not shown and the second column is displayed in place of the first one.

This happens if cellattr returns something containing the substring "style" in it.

Question: Is there any solution or work around for this problem, allowing to set attributes with values containing the word "style"?

like image 478
Denis Itskovich Avatar asked Nov 01 '22 00:11

Denis Itskovich


1 Answers

I think I found a simple workaround for my problem.

The problem occurred because jqGrid attempts to extract the style attribute from the string, returned by cellatr. It works this way in order to append the returned styles to already existing cell styles. jqGrid searches for the first occurrence of 'style'.

So my workaround is to prepend the returned string with empty style attribute:

return ' style="" customAttr: "' + attrValue + '"'

See jsfiddle with the workaround

like image 56
Denis Itskovich Avatar answered Nov 15 '22 06:11

Denis Itskovich