javascript - sort by names in a list in ascending order onclick with angularjs -
i populate brief info customers in table web api. want achieve when should click on customer name text, names there should order in ascending order , on click should toggle descending. default when page loads arranges list id descending
html
<table class="table table-striped table-hover"> <tr class="success"> <td><strong><a href="#">customer name</a></strong></td> <td><strong>phone number</strong></td> <td><strong>address</strong></td> <td><strong>gender</strong></td> <td><strong>email</strong></td> <td><strong>user group</strong></td> </tr> <tr ng-repeat="item in users_list | orderby:'-id'"> <td>{{item.customer_name}}</td> <td>{{item.phone_number}}</td> <td>{{item.address}}</td> <td>{{item.gender}}</td> <td>{{item.email}}</td> <td>{{item.user_group}}</td> </tr> </table> js
.controller('app_users_ctrl',function($scope,$http,$location){ $scope.loading=true; $http.post('http://localhost/calls/app_users.php').success(function(data){ $scope.users_list=data console.log(json.stringify(data)); $scope.loading=false; }) })
hi have tired like:
<table class="table table-striped table-hover"> <tr class="success"> <td><strong><a clikme('customer_name')>customer name</a></strong></td> <td><strong><a clikme('phone_number')>phone number</a></strong></td> <td><strong>address</strong></td> <td><strong>gender</strong></td> <td><strong>email</strong></td> <td><strong>user group</strong></td> </tr> <tr ng-repeat="item in users_list | orderby: myvar"> <td >{{item.customer_name}}</td> <td >{{item.phone_number}}</td> <td>{{item.address}}</td> <td>{{item.gender}}</td> <td>{{item.email}}</td> <td>{{item.user_group}}</td> </tr> </table> and in js:
.controller('app_users_ctrl',function($scope,$http,$location){ $scope.loading=true; var order = false; $http.post('http://localhost/calls/app_users.php').success(function(data){ $scope.users_list=data console.log(json.stringify(data)); $scope.loading=false; }) }) $scope.clikme= function(field){ $scope.myvar= order ? '-' + field : '+' + field; order=!order; }
Comments
Post a Comment