在角度上应用Kendo UI网格搜索

时间:2014-07-30 18:58:54

标签: javascript angularjs kendo-ui

我正在使用 KendoUI 作为 AngularJS 的当前应用程序。我想在 KendoUI 网格控件上添加自定义搜索功能。为此我已经在剑道网格上方放置了一个TextBox。现在我想在按钮点击上应用搜索。您能否建议我如何根据搜索条件刷新kendoUI网格数据源并进行过滤。

由于 RAVI MITTAL

2 个答案:

答案 0 :(得分:0)

之前我已经实现了类似的功能。我做的是以下内容:

首先我在网格工具栏上添加了一个过滤字段:

$("#gridPortfolio").kendoGrid({
....
toolbar: 
 [
 ...
   {name: "filter", 
    template: "<div> <input class='k-textbox k-space-right' id='FieldFilter' type='text' placeholder='NIT' disabled />\
                   <span class='k-icon k-i-search'></span>\
               </div>" },
 ],
...
});

然后我将组合框上的keyup事件绑定到这样的函数:

$("#FieldFilter").keyup(function () {
            portfolioGridFilter();
        });

最后,我在该函数中修改并应用了网格上的过滤器:

portfolioGridFilter: function () {

        var portfolioFilters = new Array();

        var searchText = $("#FieldFilter").val();

        if (searchText.length >= 3) {
            portfolioFilters.push({ field: "Field", operator: "contains", value: searchText });
        }

        if (portfolioFilters.length >= 1) {
            _yourGridsDataSource.filter(portfolioFilters);
        }

        if (searchText.length == 0) {
            _yourGridsDataSource.filter([]);
        }

    },

答案 1 :(得分:0)

这个剑道示例应该让你走在正确的轨道上: Grid with Toobar