how to change cell color of row that has subgrid opened

Hi all this is my jqgrid that has subgrid enabled.....

jQuery("#issuegrid").jqGrid({
                    url: 'griddata.aspx/IssueData?id=2',
                    datatype: 'json',
                    mtype: 'POST',
                    colNames: ['Edit', 'IssueDetailsID', 'IssueCode', 'Title', 'Type', 'Project', 'Status', 'Priority', 'EstTime', 'EstimatedTime', 'EstimatedTimeFormat', 'AssignTo', 'AssignBy', 'AssignDate', 'ModifiedBy', 'ModifiedDate'],
                    colModel: [
                        { name: 'Edit', index: 'Edit', width: 20, sortable: false, align: 'center' },
                        { name: 'IssueDetailsID', index: 'Issue_Details_ID', width: 15, hidden: true },
                        { name: 'IssueCode', index: 'ProjectCode', width: 45 },
                        { name: 'Title', index: 'IssueTitle', width: 75 },
                        { name: 'Type', index: 'IssueName', width: 70 },
                        { name: 'Project', index: 'ProjectName', width: 100, align: 'center' },
                        { name: 'Status', index: 'IssueStatus', width: 30, align: 'center' },
                        { name: 'Priority', index: 'IssuePriority', width: 30, align: 'center' },
                        { name: 'EstTime', index: 'EstTime', width: 40, align: 'center', sortable: false },
                        { name: 'EstimatedTime', index: 'EstimatedTime', width: 40, align: 'center', hidden: true },
                        { name: 'EstimatedTimeFormat', index: 'EstimatedTimeFormat', width: 40, align: 'center', hidden: true },
                        { name: 'AssignTo', index: 'UserName', width: 80, align: 'left' },
                        { name: 'AssignBy', index: 'UserName', width: 80, align: 'left' },
                        { name: 'AssignDate', index: 'AssignedDate', width: 80, align: 'left' },
                        { name: 'ModifiedBy', index: 'UserName', width: 50, align: 'left' },
                        { name: 'ModifiedDate', index: 'ModifiedDate', width: 50, align: 'left', sortable: false}],


                    pager: '#pager1',
                    rowList: [10, 20, 30],
                    sortname: 'IssueTitle',
                    rowNum: 10,
                    sortorder: "desc",
                    loadtext: "Loading....",
                    shrinkToFit: true,
                    emptyrecords: "No records to view",
                    width: x - 20,
                    height: 250,
                    rownumbers: true,
                    multiselect: false,
                    subGrid: true,
                    subGridRowExpanded: function(subgrid_id, IssueDetailsID) {
                        var subgrid_table_id, pager_id;
                        subgrid_table_id = subgrid_id + "_t";
                        pager_id = "p_" + subgrid_table_id;
                        $("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table><div id='" + pager_id + "' class='scroll'></div>");
                        jQuery("#" + subgrid_table_id).jqGrid({
                            url: 'griddata.aspx/IssueData_Child?id=4&IssueId=' + IssueDetailsID,
                            datatype: 'json',
                            height: 50,
                            type: 'POST',
                            width: 920,
                            contentType: 'application/json; charset=utf-8',
                            colNames: ['Issue_Details_ID', 'IssueCode', 'IssueTitle', 'Comments'],
                            colModel: [
                             { name: 'Issue_Details_ID_Key', index: 'Issue_Details_ID_Key', hidden: true, width: 60 },
                             { name: 'IssueCode', index: 'IssueCode', width: 60 },
                             { name: 'IssueTitle', index: 'IssueTitle', width: 60 },
                             { name: 'Comments', index: 'Comments', width: 190 }

                             ],
                            multiselect: false,
                            caption: "View Comments",
                            rowNum: 10,
                            pager: '#ChildPager',
                            rowList: [10, 15, 20, 30, 50, 100],
                            sortname: 'Issue_Details_ID_Key',
                            sortorder: "desc",
                            loadtext: "Loading....",
                            shrinkToFit: true,
                            emptyrecords: "No records to view",
                            rownumbers: true,
                            viewrecords: true
                   });
                        jQuery("#ChildGrid").jqGrid('navGrid', '#ChildPager', { edit: false, add: false, del: false });


             开发者_StackOverflow社区       },
                    subGridRowColapsed: function(subgrid_id, IssueDetailsID) {
                        // this function is called before removing the data
                        var subgrid_table_id;
                        subgrid_table_id = subgrid_id + "_t";
                        jQuery("#" + subgrid_table_id).remove();
                    }



                });

                jQuery("#issuegrid").jqGrid('navGrid', '#pager1', { edit: false, add: false, del: false });
            });

this wil enable a subgrid to open for the particular row and show the details onclicking the plus button....my problem is i have to change the color of that particular cell(row) that has subgrid opened

Thanx in advance

The setting the background color of the cell in the subgrid work exactly in the same way as for the grid. Look at the following old answers which shows different ways how one can change the the background color: this, this and if you use jqGrid 4.0 then this also.

Thanks for posting answer here. I done this in Rails. So code will be changed accordingly in rails application. I have done following code for working this in my application. I am posting this as this may help other who are using rails application.

:subGridBeforeExpand => JqgridView::Javascript.new(

         %Q^function(subgrid_id, AppID) {

               jQuery("#" + AppID).find("td").css("background-color", "#C5C5C5");
           }^),

:subGridRowColapsed => JqgridView::Javascript.new(

          %Q^function(subgrid_id, AppID) {

               jQuery("#" + AppID).find("td").css("background-color", "#f3f3f3");
           }^)