Calling a function with parameter on click of a jqgrid cell

Question

I am trying to make a cell colored and clickable if it satisfies certain condition. The problem that I am getting is in passing the parameter to the onclick of the element. I am doing something like:

{
    name: 'numberOfUnits',
    index: 'numberOfUnits',
    sorttype: 'integer',
    cellattr: function (rowId, tv, rawObject, cm, rdata) {
        if (...) {
            return 'style="background-color:red" onClick="javascript:showReceivedLockedPieChartDialog(' + '\'' + lockedCellId + '\'' + ')"';
        }
        else {
            return 'style="color:black"';
        }
    }
}

I see that the text is being formed as:

style="background-color:red" onClick="javascript:showReceivedLockedPieChartDialog('ABC')"

I see that it is creating something like this...

<td aria-describedby="reportGrid_numberOfUnits" title="13" ABC")"="" onclick="javascript:showReceivedLockedPieChartDialog(" style="background-color:red" role="gridcell">13</td>

Please help me pass the parameter to this function.

score 3 · Accepted Answer · answered Jun 08 '12 at 21:39

Ohh yes! Your code shows that the parting of string returned from cellattr will be parsed not carefully enough. I find that one should better rewrite the function formatCol which will be used internally. I wanted to post next time to trirand suggestion to change the code using RegEx matching.

Nevertheless there are some simple rules which could allow to use cellattr in the current implementation:

you should use style attribute as the last attribute in the string returned from cellattr
you should include additional ' ' blank as the first character of returned value if you returns not only the value for the style attribute.
you should not use words style, title and class only as the names of the corresponding attributes.

The last rule means that you should not use class="mytitle" or title="my class style". The parsing of the returned string is not so careful. So such names will have some side effects. As I wrote before the corresponding part of the code jqGrid which parse the results should be changed in my opinion. I will try to post the corresponding suggestions to trirand in the next time.

In your case you should rewrite the code of cellattr to

cellattr: function (rowId, tv, rawObject, cm, rdata) {
    if (...) {
        return ' onclick="showReceivedLockedPieChartDialog(' + '\'' +
            lockedCellId + '\'' + ')" style="background-color:red"';
    } else {
        return 'style="color:black"';
    }
}

The demo shows that the changes works.

Thanks a lot. This works perfectly as I wanted. I will take care of these pointers that you gave. — Sukesh Kumar, Jun 11 '12 at 15:33
Actually this is fine but when a string that contain word something like "styletest.com" passed in the function attributes then the on click function breaks the row because of string containg style word.. Any Help? — Shashank Sharma, Aug 20 '20 at 07:44

Calling a function with parameter on click of a jqgrid cell

1 Answers1

Linked