1

我有一个没有太多自定义的网格,可以很好地呈现grouping: false

如果我打开分组,边框会消失,如屏幕截图所示。

其中一个关于边框的单元格的 CSS 类是ui-jqgrid并且TR.ui-row-ltr TD将边框设置为1px solid,但它实际上并没有呈现。如果我关闭边框属性,它会将其从分组行和网格中的所有其他行中删除。

关于如何绘制此边框的任何想法?谢谢!

按要求定义网格:

{
        colNames: ["ItemId", "DetailId", "UPC", "Ship Date", "Vendor", "VendorDisplay", "Item", "UPC", "Description", "Pack", "Ret", "Exp", "Inv", "Memo", "Distro", "Requst", "Reason"],
        colModel: [
            { name: "ItemId", index: "ItemId", width: 1, hidden: true },
            { name: "DetailId", index: "DetailId", width: 1, hidden: true, editable: true },
            { name: "UPC", index: "UPC", width: 1, hidden: true },
            { name: "ShipDateDisplay", index: "ShipDateDisplay", width: 65, stype: "text", searchoptions: { dataInit: GridModels.Formatters.DatePicker, attr: { title: "Select Date"}} },                
            { name: "Vendor", index: "Vendor", width: 0, hidden: true, stype: "select", searchoptions: { searchhidden: true, value: "0:Vendor1;1:Vendor2"} },                
            { name: "VendorDisplay", index: "VendorDisplay", hidden: true },
            { name: "VendorItem", index: "VendorItem", width: 40, align: "Right" },
            { name: "UPC_DISPLAY", index: "UPC_DISPLAY", width: 70, align: "Right" },
            { name: "ItemDescription", index: "ItemDescription", width: 200 },
            { name: "CasePack", index: "CasePack", width: 35, align: "Right" },
            { name: "Retail", index: "Retail", width: 50, align: "Right", search: false, formatter: Store.Cuts.Common.RetailLoader },               
            { name: "InvQty", index: "InvQty", width: 50, align: "Right", search: false, formatter: Store.Cuts.Common.InventoryLoader },
            { name: "Memo", index: "Memo", width: 50 },
            { name: "Qty", index: "Qty", width: 30, align: "Right", search: false },
            { name: "StoreQty", index: "StoreQty", width: 35, align: "Right", search: false, editable: true, editrules: { required: true, integer: true, minValue: 0} },
            { name: "StoreReason", index: "StoreReason", width: 130, align: "Right", search: false, editable: true, edittype: "select", editoptions: { value: reasons} }
        ],
        editurl: editurl,
        url: gridurl,
        grouping: true,
        groupingView: {
            groupField: ['VendorDisplay'],
            groupColumnShow: false,
            groupText: ['<b>{0}</b>'],
            groupDataSorted: true
        },
        pager: pager,
        height: 250,
        rowNum: 20            
    };

$.extend($.jgrid.defaults, {
            datatype: 'json',
            height: "100%",
            loadui: 'none',
            jsonReader: {
                root: "Rows",
                page: "Page",
                total: "Total",
                records: "Records",
                repeatitems: false,
                userdata: "UserData",
                id: "Id",
                subgrid:
                {
                    root: "Rows",
                    repeatitems: false
                }
            },
            mtype: 'GET',
            autowidth: true,
            sortable: true,
            sortname: 'Id',
            sortorder: 'asc',
            rowNum: 10,
            rowList: [10, 20, 50, 100],
            viewrecords: true,              
            beforeRequest: function () {
                $("#load_grid").html('<h4 style="display: inline; position: relative; top: -10px; font-weight: bold">Loading...</h4>' + $(".loader").html());
                Common.Grid.DisableControls();
            },
            loadComplete: function () {
                if (!loadonce)
                    loadonce = true;

                if ($("#grid").getGridParam("reccount") === 0)
                    Common.Grid.DisplayStatus("No records found...");
                else
                    Common.Grid.HideStatus();

                if (loadCompleteEx)
                    loadCompleteEx();
            },
            gridComplete: function () {
                if (!loadonce) {
                    Common.Grid.LoadNavBar($(this));

                    // Align check all checkbox better
                    $("th[id=grid_cb]")
                        .css("text-align", "center")
                        .css("position", "relative")
                        .css("left", "1px");
                }

                if (gridCompleteEx)
                    gridCompleteEx();

                Common.Grid.EnableControls();
            }
        });

您可以使用以下 JSON 字符串在网格中填充测试数据,这会导致我出现问题:

{"Total":1,"Page":1,"Records":3,"Rows":[{"Id":1,"Description":"","ShipDate":"/Date(-62135578800000)/","ShipDateDisplay":"01/01/0001","Type":null,"IsAvailableToStores":false,"IsReadOnly":false,"IsStoreFinalized":false,"IsHQFinalized":false,"IsDeleted":false,"BuyerId":0,"Buyer":null,"Memo":null,"ItemId":0,"Vendor":"01111","VendorDisplay":"1111 - ","VendorName":null,"VendorItem":null,"UPC_DISPLAY":"00000-01111","UPC":"1111","ItemDescription":"Test","CasePack":0,"RetailAmt":0,"RetailMult":0,"Retail":"$0.00","SaleAmt":0,"SaleMult":0,"ExpressAmt":null,"ExpressMult":null,"InvQty":0,"DetailId":0,"StoreNumber":0,"StoreName":null,"OriginalQty":0,"BuyerQty":0,"Qty":0,"StoreQty":0,"StoreReason":null,"FinalQty":0},{"Id":2,"Description":"","ShipDate":"/Date(-62135578800000)/","ShipDateDisplay":"01/01/0001","Type":null,"IsAvailableToStores":false,"IsReadOnly":false,"IsStoreFinalized":false,"IsHQFinalized":false,"IsDeleted":false,"BuyerId":0,"Buyer":null,"Memo":null,"ItemId":0,"Vendor":"01111","VendorDisplay":"1111 - ","VendorName":null,"VendorItem":null,"UPC_DISPLAY":"00000-01111","UPC":"1111","ItemDescription":"Test","CasePack":0,"RetailAmt":0,"RetailMult":0,"Retail":"$0.00","SaleAmt":0,"SaleMult":0,"ExpressAmt":null,"ExpressMult":null,"InvQty":0,"DetailId":0,"StoreNumber":0,"StoreName":null,"OriginalQty":0,"BuyerQty":0,"Qty":0,"StoreQty":0,"StoreReason":null,"FinalQty":0},{"Id":3,"Description":"","ShipDate":"/Date(-62135578800000)/","ShipDateDisplay":"01/01/0001","Type":null,"IsAvailableToStores":false,"IsReadOnly":false,"IsStoreFinalized":false,"IsHQFinalized":false,"IsDeleted":false,"BuyerId":0,"Buyer":null,"Memo":null,"ItemId":0,"Vendor":"02222","VendorDisplay":"2222 - ","VendorName":null,"VendorItem":null,"UPC_DISPLAY":"00000-01111","UPC":"1111","ItemDescription":"Test","CasePack":0,"RetailAmt":0,"RetailMult":0,"Retail":"$0.00","SaleAmt":0,"SaleMult":0,"ExpressAmt":null,"ExpressMult":null,"InvQty":0,"DetailId":0,"StoreNumber":0,"StoreName":null,"OriginalQty":0,"BuyerQty":0,"Qty":0,"StoreQty":0,"StoreReason":null,"FinalQty":0}],"UserData":null}
4

1 回答 1

1

您发布的代码包括许多未定义的函数,例如自定义格式化程序等。在我评论了所有未知部分后,我收到了没有你描述的效果的演示。如果没有您未发布的代码部分,您描述的问题可能不存在。如果您发布了可用于实时查看问题的 URL(当然使用未最小化的 jqGrid 代码jquery.jqGrid.src.js),我可以查看内部。

于 2011-08-08T21:25:02.683 回答