With the DataTables Light Column Filter

The angular-datatables also provides an API in order to make the plugin Light Column Filter work with datatables.

You need to add the file angular-datatables.light-columnfilter.min.js to your HTML file.

The Light Column Filter only works with serverside processing!

The Light Column Filter does not work with Responsive. Do not use with normal Column Filter

You also need to add the dependency datatables.light-columnfilter to your Angular app.

See the API for the complete list of methods of the helper.

ID First Name Last Name
ID First Name Last Name
angular.module('showcase.withLightColumnFilter', ['datatables', 'datatables.light-columnfilter']) .controller('WithLightColumnFilterCtrl', WithLightColumnFilterCtrl); function WithColumnFilterCtrl(DTOptionsBuilder, DTColumnBuilder) { var vm = this; vm.dtOptions = DTOptionsBuilder.fromSource('data.json') .withPaginationType('full_numbers') .withLightColumnFilter({ 0 : { "type" : "text"}, 1 : { "type" : "text"}, 2 : { "type" : "text"} }); vm.dtColumns = [ DTColumnBuilder.newColumn('id').withTitle('ID'), DTColumnBuilder.newColumn('firstName').withTitle('First name'), DTColumnBuilder.newColumn('lastName').withTitle('Last name') ]; }