TableFilter icon indicating copy to clipboard operation
TableFilter copied to clipboard

How to add multiple TableFilters

Open marketingstarz opened this issue 4 years ago • 2 comments

I'm using this syntax but it's not working. Any help would be appreciated. Thank you.

The first table works, but not the second. I tried combining the two in a single init() but that didn't seem to work either.

var tf = new TableFilter('resourceTable', { base_path: 'wp-content/themes/Divi-child-viprs/js/tablefilter/',

  single_filter: {
    css_class: 'form-control',
  },
  alternate_rows: true,
  highlight_keywords: true,
  ignore_diacritics: true,
  no_results_message: false,
  btn_reset: {
    text: 'Clear Results',
  },
  auto_filter: true,
  rows_counter: false,
  watermark: 'Search...',
  loader: true,
  status_bar: true,
  rows_counter: {
    text: 'Results: '
  },

}); tf.init();

var tfs = new TableFilter('resourceTableSpanish', { base_path: 'wp-content/themes/Divi-child-viprs/js/tablefilter/',

  single_filter: {
    css_class: 'form-control',
  },
  alternate_rows: true,
  highlight_keywords: true,
  ignore_diacritics: true,
  no_results_message: false,
  btn_reset: {
    text: 'Borrar resultados',
  },
  auto_filter: true,
  rows_counter: false,
  watermark: 'Buscar...',
  loader: true,
  status_bar: true,
  rows_counter: {
    text: 'Resultados: ',
  },

}); tfs.init();

marketingstarz avatar Dec 04 '20 22:12 marketingstarz

I guess this can't work because of Javascript syntax errors. Commas are used to separate elements in arrays or objects, but cannot be used after the last element. What is your browser console saying?

rimace avatar Apr 01 '21 11:04 rimace

I'm not 100% sure what I did since it's been so long, but I think I just used one init() and used jQuery to translate the fields that I needed to.

I will say that's an awesome little library. The functionality is great. https://tvradenver.org/resources/

` var tf = new TableFilter('resourceTable', { base_path: 'wp-content/themes/Divi-child-viprs/js/tablefilter/',

  single_filter: {
    css_class: 'form-control',
  },
  alternate_rows: true,
  highlight_keywords: true,
  ignore_diacritics: true,
  no_results_message: false,
  btn_reset: {
    text: 'Clear Results'
  },
  auto_filter: true,
  rows_counter: false,
  watermark: 'Search...',
  loader: true,
  status_bar: true,
  rows_counter: {
    text: 'Results: '
  },

}); tf.init(); $('.spanishTable a.reset').text("Borrar resultados"); $('.spanishTable #flt0_resourceTable').attr('placeholder', 'Buscar...'); `

marketingstarz avatar Apr 01 '21 20:04 marketingstarz