Angular-footable filter by specific column?

Question

I haven't found on the docs of angular-footable on how to filter by a specific column. However, in this link http://fooplugins.github.io/FooTable/docs/examples/component/filtering.html footable has support to filter by specific column. Does anyone know if it is possible to achieve the same result with the angular-footable?

Answer 1

After searching through the internet, I found a code and made some changes on the way the filter of angular-footable works.

So, to filter by specific column and in my case, wants to find everything that matches what you have typed, you should put this code in your controller:

window.footable.options.filter.filterFunction = function(index) {
                var $t = $(this),
                  $table = $t.parents('table:first'),
                  filter = $table.data('current-filter'),
                  columns = $t.find('.filterByMe');


                var row = $(this).parents('tr:first');
                var someColumn = $('td',row)[1];

                var regEx = new RegExp("\\b" + filter + "\\b");
                var result = false;
                for (var i = 0; i < columns.length; i++) {
                  var text = $(columns[i]).text();
                  result = text.indexOf(filter) >= 0;
                  if (result === true)
                    break;

                  if (!$table.data('filter-text-only')) {
                     text = $(columns[i]).data("value");
                     if (text)
                       result =  text.indexOf(filter) >= 0;
                  }

                  if (result === true)
                    break;
                }

                return result;
              };

The line columns = $t.find('.filterByMe'); is where you should put another logic in your html. In my case, I added checkboxes that are related with each column of my table. If the user checks a checkbox on the search field, it means he/she wants to look for data based on that column/columns.

When the user clicks on the checkbox, the class filterByMe is added to the tag <td> of my table.

Doing that, you will be able to search by specific column.

I hope this helps anyone who is using the angular-footable and always wanted to filter by a specific column