0
我正在將現有的jqGrid（4.6.0）遷移到free-jqGrid（4.13.6或更高版本）。下面的兩個小提琴具有相同的JavaScript和HTML - 但是一個與4.6.0的jqGrid和其他與自由的jqGrid（4.13.6現在）沒有出現在jqGrid中的free-jqGrid中的背景顏色4.6.0
- 的jqGrid（4.6.0）小提琴：https://jsfiddle.net/vth5wn64/2/
- 自由的jqGrid（4.13.6）小提琴：https://jsfiddle.net/vth5wn64/3/
的自由的jqGrid不會對字幕區域所需的背景顏色。這裏缺少什麼？如何解決這個問題？
的JavaScript
function getCurrentPractice()
{
return "Test";
}
function getGridCaption() {
return "<div style='font-size:15px; font-weight:bold; display:inline; padding-left:10px;'><span class='glyphicon glyphicon-check' style='margin-right:3px;font-size:14px;'></span>" + getCurrentPractice() + " " + "</div>" +
"<div style='float:right; padding-right:20px; padding-bottom:10px; display:inline;>" +
"<div style='float:right;width:550px; padding-bottom:20px;'>" +
"<input type='text' class='form-control' id='filter' placeholder='Search' style='width:250px; height:30px; float:right; ' />" +
" </div>" +
"</div>";
}
$(function() {
////Grid
var myData = [
{ "Practice": "Test1", "ProviderID": 1, "IsPartner": true, "IsActive": true },
{ "Practice": "Test2", "ProviderID": 2, "IsPartner": true, "IsActive": true }
]
var currentPractice = "P";
var grid = $("#list2");
grid.jqGrid({
datatype: 'local',
data: myData,
additionalProperties: ["IsActive", "IsPartner"],
//additionalProperties is needed since the name is different
postData:
{
practiceName: function() { return currentPractice }
},
colNames: [
'Practice',
'ProviderID'
],
colModel: [
{ name: 'Practice', width: 220 },
{ name: 'ProviderID', width: 320 }
],
ignoreCase: true,
loadonce: true,
rowNum: 25,
rowList: [15, 25, 35, 50],
pager: '#pager2',
viewrecords: true,
sortable: true,
caption: getGridCaption(),
beforeSelectRow: function (rowid, e) {
//Avoid selection of row
return false;
},
loadComplete: function() {
}
});
grid.jqGrid('navGrid', '#pager2', { edit: false, add: false, del: false });
//Filter Toolbar
//grid.jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn" });
$("#advancedSearch").click(function() {
grid.jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn" });
});
//Top Search
$("#filter").on('keyup', function() {
var searchFiler = $("#filter").val(), f;
//alert(searchFiler);
if (searchFiler.length === 0) {
grid[0].p.search = false;
$.extend(grid[0].p.postData, { filters: "" });
}
f = { groupOp: "OR", rules: [] };
f.rules.push({ field: "Practice", op: "cn", data: searchFiler });
grid[0].p.search = true;
$.extend(grid[0].p.postData, { filters: JSON.stringify(f) });
grid.trigger("reloadGrid", [{ page: 1, current: true }]);
});
});
HTML
<div style="float:left;">
<div id="divGrid" style="width: 680px; min-height: 50px; float: left;">
<table id="list2"></table>
<div id="pager2"></div>
</div>
</div>