background color for third row in jqgrid

Question

How do I set the background color for third row in jqgrid?

$("#mygrid").jqGrid({
            url: someUrl,
            datatype: 'local',
            jsonReader: common.jqgrid.jsonReader(),
            mtype: 'POST',
            colNames: [//columns names go here],               
            colModel: [//columns go here
            ],               
            loadtext: 'Loading...',
            width: 500,
            height: 80,
            caption: 'Statistics',
            loadComplete:function(data) {   
             //do I set the color here?
            }               
        });

Sorry, but "background color for third row in jqgrid" seems very strange. I suppose that you identify the row by some other criteria: id of the row, specific content in some column or in the input data in general and so on. The 3-d row could have another position after sorting. Moreover the code which you posted is very unclear. `$("#mygrid)` should be fixed to `$("#mygrid")`, `url: someUrl, mtype: 'POST', jsonReader` will be ignored in case of using `datatype: 'local'`, one should use `data` parameter to load local data. At the end it's absolutely unclear how you fill jqGrid with the data. — Oleg, Nov 25 '15 at 17:29
Oleg, how do I add css class to the third row of jqgrid? it's always the third row. I think the question is clear. — sarsnake, Nov 25 '15 at 17:32
I tried to explain you, that it's wrong state question. Do you have some **other information** which is specific for the row? Moreover it's extremely important to know how you fill the grid with data. Could you include the information in your question and to fix the code which you posted? One need to know additionally **which version of jqGrid you use and which fork**. — Oleg, Nov 25 '15 at 17:36
Do you have some other information as the 3-d row, which is specific for the row? I mean **the content** instead of **the position** of the row. The best way to set style to some row is the usage of `rowattr` callback (see [the answer](http://stackoverflow.com/a/10531680/315935)). 4.4.4 is very old version, but it contains support of `rowattr` callback. To load the data from `url` one have to have other `datatype` as `'local'`. Which one you use (`'xml'`, `'json'`, `'jsonp'`)? Someone fill the data using `addRowData`. The `rowattr` will be **not called** in case of usage `addRowData`. — Oleg, Nov 25 '15 at 17:51
the format of parameter in `rowattr` callback in old 4.4.4 version depend on `datatype` which you use (`datatype: "xml"`, `datatype: "json"`) and even from `jsonReader` which you use. More new version of jqGrid like free jqGrid 4.10.0 have format of data in the callback `rowattr` callback which independ from `datatype`. — Oleg, Nov 25 '15 at 17:54
I see your answer on your own question. I see that you do know **the id** of the row (`secondRowId`). It's what I asked you multiple time and you never answered. In the case the usage of `rowattr` callback would be the best choice: simple and the quickest one, especially if you `gridview: true` option (recommended in all grids). The only problem: you use very old version of jqGrid, which don't have rowid as the parameter. :-) Thus you have to use the way in setting the class in `loadComplete`. — Oleg, Nov 25 '15 at 21:13

score 0 · Answer 1 · edited Apr 12 '20 at 16:57

0

Try following css. You don't need to do anything in loadComplete function.

#mygrid > tbody > tr:nth-of-type(4){
    background: red;    
}

Js Fiddle link: http://jsfiddle.net/yNw3C/12234/

edited Apr 12 '20 at 16:57

halfer

19,824
17
99
186

answered Nov 25 '15 at 19:32

Ibrahim Khan

20,616
7
42
55

score 0 · Answer 2 · edited Apr 12 '20 at 16:56

0

Here is my solution:

var tr = $("#myGrid").jqGrid("getInd", secondRowId, true);
$(tr).addClass("subheaderrow");

CSS:

.subheaderrow {
    background-color: rgb(0,71,124);
    color: #fff;
}

edited Apr 12 '20 at 16:56

halfer

19,824
17
99
186

answered Nov 25 '15 at 20:57

sarsnake

26,667
58
180
286

background color for third row in jqgrid

2 Answers2