Question

I have a jqgrid with a subgrid.

I am attempting to apply different colors to master and detail grids. I have two rules: the first one is to alternate odd and pair colors and the other one is to apply specific CSS to the row, based on values of a specific field.

Both master & details grid, contains the following gridComplete functions, where obviously childnodes index varies cause tables contains different fields:

gridComplete: function () {
            var _rows = $(".jqgrow");
            for (var i = 0; i < _rows.length; i++) {
                _rows[i].attributes["class"].value += " " + _rows[i].childNodes[4].textContent;
                _rows[i].attributes["class"].value += " " + _rows[i].childNodes[4].innerText;
            }
           applyZebra("jqTicketgrid");
        }

applyZebra function provides to alternate odd/pair colours and has already been tested on another grid which not contains a subgrid.
For the record, I found above solutions in other solved questions of this forum, and both works with “simple” jqgrids (not master/detail).

PROBLEM
The master grid is formatted only when I click to expand the detail rows, while detail subgrid never alternate colours, neither apply format based on cell contents…

Where I am wrong? Pheraps I must intercept another event which is not gridComplete? Otherwise with grid&subgrids it’s impossible to use _rows[x] & childNodes[y] attributes?

Please ask for clarifications, if needed, thx.

Thanks in advance!

Answer 1

I suppose the error in your code is that you use $(".jqgrow") instead of $(".jqgrow", this) where this inside of gridComplete will be either DOM element of the <table> of the grid or the subgid (I suppose you use grid as subgrid).

Additionally I would not recommend you to use you current code at all. It’s much more effective and simple to to use cellattr. The rawObject parameter allow you access all other cells of the current row. In the answer you will find an example of implementation.