我正在使用JQGrid。我已将文本输入框放在网格结构之外,并成功过滤了网格数据。现在我想知道如何使用JQGrid外部的文本框突出显示搜索数据的文本。
我的代码在这里:
$(document).ready(function () {
$("#Search_ServiceOrdNum").keypress(function (event) {
var keycode = event.keyCode ? event.keyCode : event.which ;
if (keycode == '13') {
globalSearchFn();
}
});
});
function globalSearchFn() {
var $grid = $("#Drilldown");
var rules = [], i, cm, postData = $grid.jqGrid("getGridParam", "postData"),
colModel = $grid.jqGrid("getGridParam", "colModel"),
searchText = $("#Search_ServiceOrdNum").val(),
l = colModel.length;
for (i = 0; i < l; i++) {
cm = colModel[i];
if (cm.search !== false && (cm.stype === undefined || cm.stype === "text")) {
rules.push({
field: cm.name,
op: "cn",
data: searchText
});
}
}
highlightFilteredData = function () {
var $self = $(this), filters, i, l, rules, rule, iCol,
isFiltered = $self.jqGrid("getGridParam", "search"),
postData = $self.jqGrid("getGridParam", "postData"),
colModel = $self.jqGrid("getGridParam", "colModel"),
colIndexByName = {};
// validate whether we have input for highlighting
if (!isFiltered || typeof postData !== "object") {
return;
}
filters = $.parseJSON(postData.filters);
if (filters == null || filters.rules == null && filters.rules.length <= 0) {
return;
}
// fill colIndexByName which get easy column index by the column name
for (i = 0, l = colModel.length; i < l; i++) {
colIndexByName[colModel[i].name] = i;
}
rules = filters.rules;
for (i = 0, l = rules.length; i < l; i++) {
rule = rules[i];
iCol = colIndexByName[rule.field];
if (iCol !== undefined) {
$("table#Drilldown > tbody > tr > td").highlight('assign');
$self.find("table#Drilldown >tbody>tr.jqgrow>td:nth-child(" + (iCol + 1) + ")").highlight(rule.data);
}
}
};
postData.filters = JSON.stringify({
groupOp: "OR",
rules: rules
});
$grid.jqGrid("setGridParam", { search: true });
$grid.trigger("reloadGrid", [{ page: 1, current: true }]);
return false;
}