【发布时间】：2011-08-08 15:57:45
【问题描述】：
我有一个没有太多自定义的网格，可以很好地使用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}
【问题讨论】：
-
您能否包括可用于重现您的问题的网格的定义。简单的grouping demos 或其他更复杂的例子，如this 没有描述的问题。
-
@Oleg 添加了代码...如果您需要更多详细信息，请告诉我。
-
ondblClickRow和onSelectRow方法似乎并不重要，因为您已经在加载网格时遇到了问题。我需要的是产生问题的测试数据。我看不到datatype的定义。你使用默认的datatype: 'xml'数据类型吗？ -
@Oleg 我总是忘记我的默认设置。我在原始代码下面添加了这些。再次感谢您的帮助。顺便说一句，我使用的浏览器是 IE8。
-
我仍然没有可以按“VendorDisplay”分组并重现您的问题的测试数据。
标签： jquery css jqgrid jqgrid-asp.net