My page contains <base href="./" /> element, and pqgrid header menu cannot be shown correctly: Each click on the header menu icon will trigger all css,js in the page to reload, and occur error.
<html>
<head>
<!-- a bug here -->
<base href="./" />
<link rel="stylesheet" href="jquery-ui.css" />
<link rel="stylesheet" href="pqgrid.min.css" />
<script src="jquery.min.js"></script>
<script src="jquery-ui.min.js"></script>
<script src="pqgrid.min.js"></script>
</head>
<body>
<div id="grid_json" style="margin:100px;"></div>
<script>
$(function () {
var data = [
{ rank: 1, company: 'Exxon Mobil', revenues: 339938.0, profits: 36130.0 },
{ rank: 2, company: 'Wal-Mart Stores', revenues: 315654.0, profits: 11231.0 }
];
var obj = {
numberCell:{resizable:true,title:"#",width:30,minWidth:30},
title: "ParamQuery Grid with JSON Data",
menuIcon: true,
scrollModel:{autoFit:true}
};
obj.colModel = [
{ title: "Rank", width: 100, dataType: "integer", dataIndx: "rank" },
{ title: "Company", width: 200, dataType: "string", dataIndx: "company" },
{ title: "Revenues ($ millions)", width: 150, dataType: "float", format: '$#,###.00', dataIndx: "revenues" },
{ title: "Profits ($ millions)", width: 150, dataType: "float", format: '$#,###.00', dataIndx: "profits" }
];
obj.dataModel = { data: data };
$("#grid_json").pqGrid(obj);
});
</script>
</body>
</html>
