Search code examples
jquerytablesorter

Show no record found using tablesorter search widget

I am using "jquery.tablesorter.widgets.js" for Table filter working fine, but I have to display " No Data Found" when records not available based on Search Criteria. I'm not using any pager on my table. i have checked this link TableFilter Plugin with Null Data but unable to resolve my problem.

Solution

  • Without the pager you'll need to create a message row yourself (demo):

    CSS

    tr.noData td {
  background: #eee;
  color: #900;
  text-align: center;
}

    JS

    $('table').on('filterEnd filterReset', function() {
  var c = this.config,
    fr = c.filteredRows;
  if (fr === 0) {
    c.$table.append([
      // "remove-me" class added to rows that are not to be included 
      // in the cache when updating
      '<tr class="noData remove-me" role="alert" aria-live="assertive">',
        '<td colspan="' + c.columns + '">No Data Found</td>',
      '</tr>'
    ].join(''));
  } else {
    c.$table.find('.noData').remove();
  }
});