0
Проблема с иконками разбиения на страницы в jqgrid не видна. Я мог видеть, что изображения .png не найдены в моей консоли.Значки с разбивкой по страницам Jqgrid отсутствуют
GET http://localhost:8080/myapp/styles/images/ui-icons_6da8d5_256x240.png 404 (Not Found)
GET http://localhost:8080/myapp/styles/images/ui-icons_6da8d5_256x240.png 404 (Not Found)
Также, хотя ширина - это «авто», появляется горизонтальная полоса прокрутки.
Данные загружаются должным образом, и моя разбивка на БД работает нормально. на первой странице отображается только значок руки, а при нажатии - на стр. 2. но на странице 2 значок не отображается.
Я скачал снова jqgrid, но там не было ни одного .png иконки в установке
Мой JSP код будет ниже -
<html>
<head>
<style>
div.ui-jqgrid-titlebar {
height: 10px;
}
#sidebar {
float: left;
width: 150px;
padding: 10px 10px;
// background-color:yellow
}
#container {
margin: 0px 320px 0px 170px;
text-align: center;
// background-color:red
}
</style>
<link rel="stylesheet" href="../styles/ui.all.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="../styles/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="../styles/ui.jqgrid.css" />
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui.min.js"></script>
<script type="text/javascript" src="../js/grid.locale-en.js"></script>
<script type="text/javascript" src="../js/jquery.jqGrid.min.js"></script>
<link href="../images/favicon.ico" type="image/x-icon" rel="shortcut icon">
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script type="text/javascript">
//index is used to override the column name passed to the server in the query param sidx
var myColModel = [
{ name: "promId", index: 'Promotionid', width: 60 },
{ name: "promoCode", index: 'promotioncode', width: 110 },
{ name: "name", index: 'name', width: 160 },
{ name: "description", index: 'description', width: 250 },
{ name: "distCode", index: 'distributor_code', width: 110 },
{ name: "status", index: 'status', width: 110 },
{ name: "startDate", index: 'start_date', width: 100, sorttype: "date", align: "right" },
{ name: "endDate", index: 'end_date', width: 100, sorttype: "date", align: "right" },
{ name: "discount", index: 'discount', width: 90 },
{ name: "extension", index: 'extension', width: 90 }
];
$(function() {
$("#list").jqGrid({
url: 'some/url',
datatype: "json",
mtype: "GET",
colNames: ["Promo ID", "Promo Code", "Name", "Description", "Distributor Code", "Status", "Start Date", "End Date", "Discount", "Extension"],
colModel: myColModel,
pager: "#pager",
rowNum: 10,
rowList: [10, 20, 30],
sortname: "end_date",
sortorder: "asc",
viewrecords: true,
gridview: true,
rownumber: true,
autoencode: true,
width: 'auto',
height: 'auto',
caption: "Promotion Summary"
});
});
</script>
</head>
<br></br>
<body>
<br>
<br>
<center>
<hr />
<div class="clear">
<%@ include file="header.jsp"%>
</div>
</center>
<div class="sidebar">
<%@ include file="/admin/User.jsp"%>
</div>
<br>
<br>
<div id="container" border="2px solid green"
style="left: 5%; position: relative;">
<div id="tableContent" width="100%">
<div>Summary</div>
<div style = "margin: 0px auto 0px 150px;">
<table id="list"><tr><td></td></tr>
</table>
<div id="pager"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>