Question

大家好，这是我启用了子网格的jqgrid .....

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 });


                    },
                    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 });
            });

这将启用子网格为特定行打开并显示单击加号按钮的详细信息....我的问题是我必须更改已打开子网格的特定单元格（行）的颜色

提前完成

Answer 1

在子网格中设置单元格的背景颜色的工作方式与网格完全相同。查看以下旧答案，其中显示了如何更改背景颜色的不同方法：this，this以及如果您使用jqGrid 4.0，则this也是如此。

Answer 2

感谢您在此发帖回答。我在Rails中完成了这个。因此代码将在rails应用程序中相应更改。我在我的应用程序中完成了以下代码。我发布这个，因为这可能会帮助其他使用rails应用程序的人。

：subGridBeforeExpand =＆gt; JqgridView :: Javascript.new（

         %Q^function(subgrid_id, AppID) {

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

：subGridRowColapsed =＆gt; JqgridView :: Javascript.new（

          %Q^function(subgrid_id, AppID) {

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

如何更改已打开子网格的行的单元格颜色

2 个答案: