Javascript JQGrid navGrid寻呼机按钮重叠
我对Jquery网格的寻呼机有问题。起初我认为它工作得很好,但现在寻呼机上的按钮重叠了。我使用的是asp.NETMVC4,所有数据都显示正确,一切正常,只是寻呼机箭头不工作,按钮重叠。非常感谢您对如何解决此问题的帮助 JQGrid的javascript代码如下所示:Javascript JQGrid navGrid寻呼机按钮重叠,javascript,c#,html,asp.net-mvc-4,jqgrid-asp.net,Javascript,C#,Html,Asp.net Mvc 4,Jqgrid Asp.net,我对Jquery网格的寻呼机有问题。起初我认为它工作得很好,但现在寻呼机上的按钮重叠了。我使用的是asp.NETMVC4,所有数据都显示正确,一切正常,只是寻呼机箭头不工作,按钮重叠。非常感谢您对如何解决此问题的帮助 JQGrid的javascript代码如下所示: $(function () { $("#ListGrid").jqGrid({ url: "/Transaction/GetTransactions", datatype: "json",
$(function () {
$("#ListGrid").jqGrid({
url: "/Transaction/GetTransactions",
datatype: "json",
colNames: ["BSN", "Date", "Ship From", "Address", "City", "EDI"],
colModel: [
{ key: true, hidden: false, name: 'SHIPMENT_IDENTIFICATION', sortable: false, index: 'SHIPMENT_IDENTIFICATION', editable: true, align: 'center',
formatter: showBsnLink
},
{ key: false, name: 'DATE', index: 'DATE', editable: true, sortable: true, formatter: 'date', align: 'center' },
{ key: false, name: 'NAME', index: 'NAME', editable: true, sortable: true, align: 'center', formatter: showClientLink },
{ key: false, name: 'ADDRESS_INFORMATION_01', index: 'ADDRESS_INFORMATION_01', editable: true, align: 'center' },
{ key: false, name: 'CITY_NAME', index: 'CITY_NAME', editable: true, align: 'center' },
{ key: false, name: 'View EDI', index: 'EDI', align: 'center', formatter: showEdiLink, editable: true }
],
rowNum: 10,
mtype: 'Get',
height: 'auto',
rowList: [10, 20, 30, 40],
pager: jQuery('#pager'),
sortname: 'SHIPMENT_IDENTIFICATION',
viewrecords: true,
sortorder: 'desc',
loadonce: false,
altRows: true,
caption: "Transactions",
emptyrecords: 'No records to display',
jsonReader: {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: false,
Id: "0"
},
autowidth: true,
shrinkToFit: true,
multiselect: false,
/*
onSelectRow: function(id, status) {
var rowData = $("#ListGrid").jqGrid('getRowData', id);
window.location = "/Transaction/GetInfo/?date=" + rowData.TargetDate + "&id=" + rowData.Id;
}*/
onCellSelect: function (rowid, columnIndex, cellcontent, e) {
/*
alert(cellcontent);
if (columnIndex == 2) {
$('select[id=clientName]').val(cellcontent);
$('#clientName').selectpicker('refresh');
}*/
}
}).navGrid('#pager', { search: false, add: false, del: false, edit: false });
});
public JsonResult GetTransactions(string sidx, string sord, int page, int rows, DateTime? DateFrom, DateTime? DateTo,
string shipmentId, string clientName)
{
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
IEnumerable<ShipmentInfo> transactionResults = TransactionProvider.getTransactions();
// Check if the user wants to filter by Shipment ID
if (!shipmentId.IsEmpty())
{
transactionResults = transactionResults.Where(x => x.SHIPMENT_IDENTIFICATION.Contains(shipmentId));
}
// Check if the user wants to filter by clientName
if (!clientName.IsEmpty() && clientName != "All")
{
transactionResults = transactionResults.Where(x => x.NAME.Contains(clientName));
}
// Check if the user wants to filter from Date
if (DateFrom.HasValue)
{
transactionResults = transactionResults.Where(x => x.DATE >= DateFrom);
}
// Check if the user wants to filter from Date
if (DateTo.HasValue)
{
transactionResults = transactionResults.Where(x => x.DATE <= DateTo);
}
int totalRecords = transactionResults.Count();
var totalPages = (int)Math.Ceiling((float)totalRecords / (float)rows);
// Sort by descending
if (sord.ToUpper() == "DESC")
{
transactionResults = transactionResults.OrderByDescending(s => s.SHIPMENT_IDENTIFICATION);
transactionResults = transactionResults.Skip(pageIndex * pageSize).Take(pageSize);
}
else // Sort by Ascending
{
transactionResults = transactionResults.OrderBy(s => s.SHIPMENT_IDENTIFICATION);
transactionResults = transactionResults.Skip(pageIndex * pageSize).Take(pageSize);
}
var jsonData = new
{
total = totalPages,
page,
records = totalRecords,
rows = transactionResults
};
return Json(jsonData, JsonRequestBehavior.AllowGet);
}
服务器端的代码如下所示:
$(function () {
$("#ListGrid").jqGrid({
url: "/Transaction/GetTransactions",
datatype: "json",
colNames: ["BSN", "Date", "Ship From", "Address", "City", "EDI"],
colModel: [
{ key: true, hidden: false, name: 'SHIPMENT_IDENTIFICATION', sortable: false, index: 'SHIPMENT_IDENTIFICATION', editable: true, align: 'center',
formatter: showBsnLink
},
{ key: false, name: 'DATE', index: 'DATE', editable: true, sortable: true, formatter: 'date', align: 'center' },
{ key: false, name: 'NAME', index: 'NAME', editable: true, sortable: true, align: 'center', formatter: showClientLink },
{ key: false, name: 'ADDRESS_INFORMATION_01', index: 'ADDRESS_INFORMATION_01', editable: true, align: 'center' },
{ key: false, name: 'CITY_NAME', index: 'CITY_NAME', editable: true, align: 'center' },
{ key: false, name: 'View EDI', index: 'EDI', align: 'center', formatter: showEdiLink, editable: true }
],
rowNum: 10,
mtype: 'Get',
height: 'auto',
rowList: [10, 20, 30, 40],
pager: jQuery('#pager'),
sortname: 'SHIPMENT_IDENTIFICATION',
viewrecords: true,
sortorder: 'desc',
loadonce: false,
altRows: true,
caption: "Transactions",
emptyrecords: 'No records to display',
jsonReader: {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: false,
Id: "0"
},
autowidth: true,
shrinkToFit: true,
multiselect: false,
/*
onSelectRow: function(id, status) {
var rowData = $("#ListGrid").jqGrid('getRowData', id);
window.location = "/Transaction/GetInfo/?date=" + rowData.TargetDate + "&id=" + rowData.Id;
}*/
onCellSelect: function (rowid, columnIndex, cellcontent, e) {
/*
alert(cellcontent);
if (columnIndex == 2) {
$('select[id=clientName]').val(cellcontent);
$('#clientName').selectpicker('refresh');
}*/
}
}).navGrid('#pager', { search: false, add: false, del: false, edit: false });
});
public JsonResult GetTransactions(string sidx, string sord, int page, int rows, DateTime? DateFrom, DateTime? DateTo,
string shipmentId, string clientName)
{
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
IEnumerable<ShipmentInfo> transactionResults = TransactionProvider.getTransactions();
// Check if the user wants to filter by Shipment ID
if (!shipmentId.IsEmpty())
{
transactionResults = transactionResults.Where(x => x.SHIPMENT_IDENTIFICATION.Contains(shipmentId));
}
// Check if the user wants to filter by clientName
if (!clientName.IsEmpty() && clientName != "All")
{
transactionResults = transactionResults.Where(x => x.NAME.Contains(clientName));
}
// Check if the user wants to filter from Date
if (DateFrom.HasValue)
{
transactionResults = transactionResults.Where(x => x.DATE >= DateFrom);
}
// Check if the user wants to filter from Date
if (DateTo.HasValue)
{
transactionResults = transactionResults.Where(x => x.DATE <= DateTo);
}
int totalRecords = transactionResults.Count();
var totalPages = (int)Math.Ceiling((float)totalRecords / (float)rows);
// Sort by descending
if (sord.ToUpper() == "DESC")
{
transactionResults = transactionResults.OrderByDescending(s => s.SHIPMENT_IDENTIFICATION);
transactionResults = transactionResults.Skip(pageIndex * pageSize).Take(pageSize);
}
else // Sort by Ascending
{
transactionResults = transactionResults.OrderBy(s => s.SHIPMENT_IDENTIFICATION);
transactionResults = transactionResults.Skip(pageIndex * pageSize).Take(pageSize);
}
var jsonData = new
{
total = totalPages,
page,
records = totalRecords,
rows = transactionResults
};
return Json(jsonData, JsonRequestBehavior.AllowGet);
}
public JsonResult GetTransactions(字符串sidx、字符串sord、int page、int行、DateTime?DateFrom、DateTime?DateTo、,
字符串shipmentId,字符串clientName)
{
int pageIndex=Convert.ToInt32(第页)-1;
int pageSize=行;
IEnumerable transactionResults=TransactionProvider.getTransactions();
//检查用户是否希望按装运ID进行筛选
如果(!shipmentId.IsEmpty())
{
transactionResults=transactionResults.Where(x=>x.shipping_IDENTIFICATION.Contains(shipmentId));
}
//检查用户是否希望按clientName进行筛选
如果(!clientName.IsEmpty()&&clientName!=“全部”)
{
transactionResults=transactionResults.Where(x=>x.NAME.Contains(clientName));
}
//检查用户是否希望从日期开始筛选
if(DateFrom.HasValue)
{
transactionResults=transactionResults。其中(x=>x.DATE>=DateFrom);
}
//检查用户是否希望从日期开始筛选
if(DateTo.HasValue)
{
transactionResults=transactionResults.其中(x=>x.DATE s.Shipping\U标识);
transactionResults=transactionResults.Skip(页面索引*页面大小)。Take(页面大小);
}
else//按升序排序
{
transactionResults=transactionResults.OrderBy(s=>s.Shipping\U标识);
transactionResults=transactionResults.Skip(页面索引*页面大小)。Take(页面大小);
}
var jsonData=new
{
总计=总页数,
页
记录=总记录,
行=transactionResults
};
返回Json(jsonData、JsonRequestBehavior.AllowGet);
}
这是HTML视图,使用Bootstrap 3:
<div id="gridContainer" class="col-sm-9 col-md-10 col-xs-12 col-lg-10 row-offcanvas">
<table id="ListGrid"></table>
<div id="pager"></div>
<div class="container-fluid" style="padding-top: 10px;">
<div class="row">
@using (Html.BeginForm("exportPDF", "Transaction", FormMethod.Post, new {@class = "form-inline", @role = "form", @id = "actionForm"}))
{
<div class="form-group">
<button class="btn btn-info" type="submit" name="action" value="export">Export to PDF</button>
<button class="btn btn-info" type="submit" name="action" value="print" onclick="document.getElementById('actionForm').target = '_blank';">Print</button>
</div>
}
<div id="dialog" title="EDI">
</div>
</div>
</div>
</div>
@使用(Html.BeginForm(“exportPDF”、“Transaction”、FormMethod.Post、new{@class=“form inline”、@role=“form”、@id=“actionForm”}))
{
导出为PDF
打印
}
任何帮助都将不胜感激。发现问题,按钮重叠,因为我使用的自定义css文件覆盖了JQGrid css的文本输入