3

how can i use slickGrid in my grails application for searching in multiple column at a time?

https://github.com/mleibman/SlickGrid/tree/master/examples

sanghavi7
  • 758
  • 1
  • 15
  • 38

3 Answers3

7

Here is code for searching on multi-column.

var dataView = new Slick.Data.DataView();
var slickGrid = new Slick.Grid($('#grid_div'), dataView, gridColumns, gridOptions);

$('#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();

});

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;
            }
Niks Jain
  • 1,617
  • 5
  • 27
  • 53
  • yeh..just type your keywords with space seperator..this should works – Niks Jain Oct 31 '12 at 09:40
  • 1
    Always WC.. & even you can add up there delay in execution so that this would work more faster..refer below link.. http://stackoverflow.com/questions/12858069/on-key-up-vs-on-change-with-ajax-queries-which-is-better/12858253#12858253 – Niks Jain Oct 31 '12 at 10:04
  • 3
    I don't get what gridSearchList is. Is this an array of your columns where he needs to search? How can this be space separator? – Freddy Dec 19 '13 at 16:24
  • I'm stuck on this. I started a topic on this. If you would care to help. http://stackoverflow.com/questions/20699820/slickgrid-multi-column-filtering – Freddy Dec 20 '13 at 09:19
  • What is gridSearchList? – bumpkin Jan 13 '15 at 19:25
1

For searching in multiple columns (for data retrieved from the server via ajax) I have done the following:

Use the filter code as shown in: http://mleibman.github.com/SlickGrid/examples/example4-model.html, but change the code within the "myFilter" function to this:

function myFilter(item, args) {
    if (args.searchString != "" && item["field1"].indexOf(args.searchString) == -1 &&
                                   item["field2"].indexOf(args.searchString) == -1 &&
                                   item["field3"].indexOf(args.searchString) == -1)                                         
    {
        return false;
    }
    return true;

}

And so on... hopefully this will help!

Kjuly
  • 34,476
  • 22
  • 104
  • 118
user1192900
  • 49
  • 7
0

This works with space separator:

var grid;
var dataView;
var searchList = [];

function myFilter(item, args) {
    var mnull = 0, optnull = 0, l = searchList.length, len = grid.getColumns().length;
    for (var i = 0; i < l; i++) {
        for (var j = 0; j < len; j++) {
            if (item[grid.getColumns()[j].field].toLowerCase().indexOf(searchList[i]) == -1) {mnull++}
        }
        if (mnull == len) {optnull++}
        mnull = 0;
    }
    /* For searching like with operator "OR" 
    if (optnull == l && optnull != 0) {return false;}
    */
    if (optnull != 0) {return false;}
    return true;
}

jQuery(function ($) {
    dataView = new Slick.Data.DataView();
    grid = new Slick.Grid($("#container"), dataView, columns, options);

    $("#txtSearch").keyup(function (e) {
        // clear on Esc
        if (e.which == 27) {
            this.value = "";
        }
        searchList = $.trim(this.value.toLowerCase()).split(' ');
        dataView.refresh();
    });

    dataView.beginUpdate();
    dataView.setItems(data);
    dataView.setFilter(myFilter);
    dataView.endUpdate();
});
Денис Смаль
  • 114
  • 7