I am new to angularjs and angular datatable.
I am new to angularjs and angular datatable.
rajivkumar87
Posts: 4Questions: 1Answers: 0
I am trying re-produce the example given in "http://l-lin.github.io/angular-datatables/#/zeroConfig", I followed the same step mentioned in. still i am not able to get the out put as mentioned. my code is
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="myApp31">
<head>
<!--Bootstrap css files-->
<link href="css/bootstrap.min.css" rel="stylesheet" />
<!--jquery files-->
<script src="lib/jquery.min.js"></script>
<script src="lib/datatable/js/jquery.dataTables.js"></script>
<script src="lib/angular.min.js"></script>
<script src="lib/datatable/js/angular-datatables.js"></script>
<!--<script src="lib/bootstrap.min.js"></script>-->
<!--angular files-->
<script src="angularfiles/module/module31.js"></script>
<script src="angularfiles/controller/controller31.js"></script>
<script src="angularfiles/services/service31.js"></script>
<title>level 31</title>
</head>
<body ng-controller="myController31">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Age</th>
<th>Location</th>
<th>Special At</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="driver in driversList">
<td>{{driver.Id}}</td>
<td>{{driver.Name}}</td>
<td>{{driver.Age}}</td>
<td>{{driver.Location}}</td>
<td>{{driver.SpecialAt}}</td>
</tr>
</tbody>
</table>
</body>
</html>
Angular code is :
Module :
'use strict';
var module31 = angular.module('myApp31', ['datatables']);
Controller is :
module31.controller("myController31", ["$scope", "service", function ($scope, service) {
$scope.driversList = [];
service.getDrivers().success(function (response) {
$scope.driversList = response;
});
}]);
Service is:
module31.factory("service", function ($http) {
var driverList = {};
driverList.getDrivers = function () {
return $http({
method: 'POST',
url: 'WebService.asmx/GetData'
});
}
return driverList;
});
I have split the code in to 3 files of javascript, when i remove the 'datatable' from the module, its working fine.
var module31 = angular.module('myApp31', ['datatables']);
looking for some help on this,
thanks in advance.
Answers
Sorry bud, this isnt an AngularJS forum.. If you have a problem specifically with DataTables, then thats when youd come here. But when it has anything to do with AngularJS, then you have to look elsewhere
yes, but i am trying to use angular-datatables.js to construct my table,
I have used jquery data table with ajax calls and they are working fine.
same thing i am trying to do with angularjs..
Right, angular-datatables.js.. That wasn't created by DataTables developers
You said you were able to get DataTables working, but now you're trying to get it working with AngularJS, so this would be something the AngularJS community would have to help you with.
Sorry
oh, ok
but this URL : http://l-lin.github.io/angular-datatables/#/withOptions is not belonging to dataTable developers?
no, it says right on there who its by... l-lin
Datatables would be by 'DataTables'
Check out this previous thread for one approach: https://www.datatables.net/forums/discussion/21286/datatables-and-angularjs