Light Column Filter plugin not working

Hi everyone,

First of all, this is the versions i’m using.

• jquery: 1.11.1
• datatables: 1.10.12
• angular-datatables: 0.5.6 (dev)

I have an AngularJs application with Angular Datatables and it works really well. I’m using some plugins like withFixedHeader (http://l-lin.github.io/angular-datatables/#/withFixedHeader) and it work’s fine too. But now, i need individual filters in my columns.

I tried columnFilter plugin but no success (i did not find dataTables columnFilter js file). Working with lightColumnFilter (http://l-lin.github.io/angular-datatables/#/withLightColumnFilter) it gives no error but filters are not added to the table, only a new row tr. Here’s a image of it.

Here’s also my controller js.

       vm.dtOptions = DTOptionsBuilder.fromFnPromise(function() {
            var defer = $q.defer();
            vm.mainService.getAll(subsegmento).then(function(result) {
                if (result.data.error === true) $location.path('/home/index');
                defer.resolve(result.data);
            });
            return defer.promise;
        })
        .withPaginationType('full_numbers').withOption('createdRow', createdRow)
        .withOption('headerCallback', function(header) {
            if (!vm.headerCompiled) {
                vm.headerCompiled = true;
                $compile(angular.element(header).contents())($scope);
            }
        })
        .withFixedHeader({ bottom: true })
        .withOption('deferRender', true)
        .withOption('initComplete', function() {
           angular.element('.dataTables_filter input').attr('placeholder','Buscar...'); 
           angular.element('.dataTables_filter input').addClass('form-control');
           angular.element('.dataTables_filter label').addClass('top_search');
           angular.element('#DataTables_Table_0_info').addClass('dataTables_info');
           angular.element('#DataTables_Table_0_paginate').addClass('datatable-responsive_paginate');
        })
        .withLightColumnFilter({
            '0' : { },
            '1' : { type : 'text' },
            '2' : { type : 'text' },
            '3' : { type : 'text' }
        });

        vm.dtColumns = [
                        DTColumnBuilder.newColumn('id').withTitle('ID'),
                        DTColumnBuilder.newColumn('ean').withTitle('ean'),
                        DTColumnBuilder.newColumn('name').withTitle('Nome'),
                        DTColumnBuilder.newColumn('n').withTitle('NCM'),
                        DTColumnBuilder.newColumn('subsegment_id').withTitle('Subsegmento')
        ];

Does anyone knows what’s happening?

Thanks for any help!

[addario]

I made it work by importing the script versions of your site

<script src="http://l-lin.github.io/angular-datatables/archives/vendor/datatables-light-columnfilter/dist/dataTables.lightColumnFilter.min.js"></script> <script src="http://l-lin.github.io/angular-datatables/archives/dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.js"></script>

I removed the scripts add by bower and I manually add the versions of your site and now is working

[izthuca]

It works! Has anyone tried to implement the column filter search?

Thanks!