Angularjs jQuery datatables add processing event

Question

I use the Angular datatables module. https://github.com/l-lin/angular-datatables

I try add the processing.dt event, but it does not work.

This is the original code from the base api https://datatables.net/reference/event/processing

$('#example')
    .on( 'processing.dt', function ( e, settings, processing ) {
        $('#processingIndicator').css( 'display', processing ? 'block' : 'none' );
    } )
    .dataTable();

And this is my unworked code

.withOption('processing.dt', function( e, settings, processing){
           console.log(processing);
           $scope.loading = processing;
           }) .withOption('initComplete', function(){
                $scope.loading = false;
           })

davidkonrad · Accepted Answer · 2016-02-16 09:50:47Z

4

There is no difference in using the dataTables events when dealing with angular datatables. If you have a table

<table datatable dt-options="dtOptions" dt-columns="dtColumns" id="example">

then this works [ http://plnkr.co/edit/hBDjR9ytD0hK6YgwrgMd?p=preview ]

$('#example').on('processing.dt', function() {
   console.log('processiong.dt');
})

and this works [ http://plnkr.co/edit/zKYyrneXl2YudNTXZkXv?p=preview ]

angular.element('#example').on('processing.dt', function() {
   console.log('processiong.dt');
})

If you use a dtInstance you can even attach event listeners to that too (here waiting for dtInstance to be initialised, then attaching a order.dt handler [ http://plnkr.co/edit/DJa1xwzxArrWhplDY278?p=preview ]) :

$scope.dtInstance = {}    

$scope.$watch('dtInstance', function() {
    if ($scope.dtInstance.DataTable) {
        $scope.dtInstance.DataTable.on('order.dt', function() {
           console.log('order.dt')
        })
    }
})

Just to demonstrate that there is no particular "angular datatables" way of handling events, it is basically the exact same - you just have a few more options since you also have the angular.element() way and can work on the special dtInstance object.

answered Feb 16, 2016 at 9:50

davidkonrad

85.7k17 gold badges211 silver badges273 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

24sharon Over a year ago

angular.element('#cart_activity_table').on('processing.dt', function( e, settings, processing){ $scope.loading = processing; }); worked

Collectives™ on Stack Overflow

Angularjs jQuery datatables add processing event

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related