Only display rows containing "Tokyo" in the third column (with a selcet tag) - jsfiddle provided.

kjemmo

Hi.

Jsfiddle here: https://jsfiddle.net/kjemmo/3hu29o7g/

I am looking for a way to filter a table with a select dropdown. I have created the table and used Custom toolbar elements to add the select tag and options.

The goal is to filter the table with the select dropdown, so that when Tokyo is selected only rows that contain Tokyo in the third column is displayed. Like in this mockup.

I need help getting the javascript to work and are unsure what the best approach is. If some one can provide a fork of the jsfiddle with a working example I will be thanksful.

colin

Hi @kjemmo ,

Yep, you just need to call column().search() with the value in the dropdown whenever it changes.

Cheers,

Colin

kjemmo

@colin

Thanks. I am not the best at javascript, so if anyone have time to show me a working example I will be greatful.

Thanks.

colin

You could use this example as a template, it's showing how to search for values within a dropdown.

kjemmo

Thanks @colin !