Angular dataTables with Ajax Source

Question

I'm trying to load data from an ajax source into angular datatable but it's not even hitting the ajax call.

var analyzer=angular.module('analyzer', ['datatables']);
analyzer.controller('WithAjaxCtrl', WithAjaxCtrl);

            function WithAjaxCtrl(DTOptionsBuilder, DTColumnBuilder) {
                    var vm = this;

                    $scope.dtOptions = DTOptionsBuilder.fromSource('/analyzer/List')

                    $scope.dtColumns = [
                    DTColumnBuilder.newColumn('BuildName').withTitle('Name'),
                    DTColumnBuilder.newColumn('Total').withTitle('Total'),
                    DTColumnBuilder.newColumn('Passed').withTitle('Passed'),
                    DTColumnBuilder.newColumn('Failed').withTitle('Failed')

                ];
            }

Here's the html code for the table-

<div ng-controller="WithAjaxCtrl">
     <table datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="row-border hover"></table>
</div>

data from ajax source is in the form -

{"responseCode":0,"responseData":[{"Name":"Rob","Total":6273,"Passed":5874,"Failed":399}]}

So will i have to define the datasrc ?

davidkonrad · Accepted Answer · 2016-08-16 10:35:27Z

3

Yes, you need to specify the dataSrc since your rows is contained in responseData, not in the default or expected data property. In angular dataTables there is an option setter named withDataProp() :

$scope.dtOptions = DTOptionsBuilder.fromSource('/analyzer/List')
  .withDataProp('responseData')

Cannot link directly but look at https://l-lin.github.io/angular-datatables/#/api

answered Aug 16, 2016 at 10:35

davidkonrad

85.7k17 gold badges211 silver badges273 bronze badges

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

Collectives™ on Stack Overflow

Angular dataTables with Ajax Source

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related