我有一个没有太多自定义的网格,可以使用grouping: false
如果我启用分组,边框将消失,如屏幕截图所示。
有关边框的其中一个单元格的CSS类是ui-jqgrid
和TR.ui-row-ltr TD
,其边框设置为1px solid
,但实际上并未呈现。如果我关闭border属性,它会将其从分组行和网格中的所有其他行中删除。
有关如何绘制此边框的任何想法?谢谢!
按要求定义网格:
{
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}
答案 0 :(得分:1)
您发布的代码包含许多未定义的函数,如自定义格式化程序等。在我评论了所有未知部分后,我收到了the demo,其中没有您描述的效果。如果没有您未发布的代码部分,您所描述的问题可能不存在。如果您发布了可用于实时查看问题的URL(当然使用未经过最小化的jqGrid代码jquery.jqGrid.src.js
),我可以查看内部。