如何使用JQGrid外部的文本框突出显示搜索数据上的文本?

时间:2017-03-13 18:53:11

标签: jquery jqgrid highlight

我正在使用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;
}

0 个答案:

没有答案