WijGrid:实现过滤功能相应回车键

发布时间:2012/12/06 00:12 发布者:iceman

返回博客中心

 

Wijmo Grid 插件(wijgrid) 是一款数据表格插件允许用户选择、排序、分组和过滤等。这个表格插件提供高度的扩展功能,可以使该控件更加的友好。

在这篇文章中我们将讨论如何使用Enter 键来调用过滤功能。

实现方式为,我们通过FilterRow keyPress 事件来触发过滤。这些文本框的类型为wijmo-wijgrid-filter-input类。jQuery的代码如下:

$(".wijmo-wijgrid-filter-input").keypress(function (s, args) {

     if (s.keyCode == 13) {

          ApplyFilter($(this));

    }

});

ApplyFilter() 方法的基本思想是获取FilterRow 的输入值用作 FilterValue 选项。 根据当前列的数据类型,我们选择正确的FilterOperator,例如,我们使用 ‘contains‘ 来过滤字符串列, ‘equals‘方法来过滤数值列。

function ApplyFilter($elem) {

    var colindex = $(".wijmo-wijgrid-filter-input").index($elem);

    var id = $(".wijmo-wijgrid-filter-input").eq(colindex).val();

    var grid = $("#demo").data("wijgrid");

    if (id != "") {

        //Apply filter

        grid.columns()[colindex].option("filterValue", id);

        //Define the FilterOperator

        if (grid.columns()[colindex].options.dataType == "string")

            grid.columns()[colindex].option('filterOperator', 'contains');

        else

            grid.columns()[colindex].option('filterOperator', 'equals');

    }

    else {

        grid.columns()[colindex].option("filterOperator", "nofilter");

    }

}

Download Sample


关于葡萄城

赋能开发者!葡萄城是专业的集开发工具、商业智能解决方案、低代码开发平台于一身的软件和服务提供商,为超过 75% 的全球财富 500 强企业提供服务。葡萄城专注控件软件领域30年,希望通过模块化的开发控件、灵活的低代码应用开发平台等一系列开发工具、解决方案和服务,帮助开发者快速响应复杂多变的业务需求,最大程度地发挥开发者的才智和潜能,让开发者的 IT 人生更从容更美好。

了解详情,请访问葡萄城官网