【问题标题】:SlickGrid - Getting the Keyword Search Filter to WorkSlickGrid - 让关键字搜索过滤器工作
【发布时间】:2012-11-02 19:22:40
【问题描述】:

我正在尝试为我正在开发的项目选择 SlickGrid,我首先尝试重新创建开箱即用的示例,除了随机生成的数据和CSS。现在唯一不起作用的是搜索功能。如果你们中的一些人可以查看我的代码并让我知道我做错了什么,我将非常感激。这是链接:http://www.tomryandesign.com/dev/datagrid/custom2/

【问题讨论】:

    标签: jquery search slickgrid


    【解决方案1】:

    试试这个说明性的例子。

    var dataView = new Slick.Data.DataView();
    var slickGrid = new Slick.Grid($('#grid_div'), dataView, gridColumns, gridOptions);
    //Keyup event on search selector..
    $('#search').keyup(function(e) {
     // clear on Esc
      if (e.which == 27) {
       this.value = "";
      }
    
      var searchList = $.trim(this.value.toLowerCase()).split(' ');
      dataView.setFilter(gridFilter);  
      slickGrid.invalidate();
      this.focus();
    
    });
    //This is custom logic for grid Filtering..
    function gridFilter (rec) {
                var found;
    
                for (i = 0; i < gridSearchList.length; i += 1) {
                    found = false;
                    $.each(rec, function(obj, objValue) {
                        if (typeof objValue !== 'undefined' && objValue != null 
                        && objValue.toString().toLowerCase().indexOf(gridSearchList[i]) != -1) {
                            found = true;
                            return false; //this breaks the $.each loop
                        }
                    });
                    if (!found) {
                        return false;
                    }
                }
    
                return true;
            }
    

    这应该可以满足您的要求。

    祝你好运。尼克斯

    【讨论】:

    【解决方案2】:

    在你的触发器部分,添加这个:

    $('#search').keyup(function(e) {
        if(e.which === 27) {   // clear on esc
            this.value = '';    
        }
    
        dataView.setFilter(gridFilter);
        slickGrid.invalidate();
     });
    
    **//create a function gridFilter**
    
    function gridFilter (rec) {
            var found,
                searchData = $.trim($('#search').val()).toLowerCase().split(' ');
        for (i = 0; i < searchData.length; i += 1) {
            found = false;
            $.each(rec, function(obj, objValue) {       
            if (typeof objValue !== 'undefined' && objValue != null && objValue.toString().toLowerCase().indexOf(searchData[i]) != -1) {
                found = true;
                return false; //this breaks the $.each loop
            }
        });
        if (!found) {
            return false;
        }
      }
        return true;        
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-09-03
      • 1970-01-01
      • 2020-01-28
      • 2020-10-30
      • 2021-11-06
      • 2017-03-13
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多