angularjs - Add or delete multiple items with conditions of AND/OR/NOT in angular js -
this html view having functionality add or delete items. want add next item, on basis of and/or/not i.e &&/||/!.
---html---
<body ng-app="myapp" ng-controller="listcontroller"> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="panel panel-default"> <div class="panel-body"> <form ng-submit="addnew()"> <table class="table table-striped table-bordered"> <thead> <tr> <th><input type="checkbox" ng-model="selectedall" ng-click="checkall()" /></th> <th>firstname</th> <th>lastname</th> <th>email</th> </tr> </thead> <tbody> <tr ng-repeat="personaldetail in personaldetails"> <td> <input type="checkbox" ng-model="personaldetail.selected"/></td> <td> <input type="text" class="form-control" ng-model="personaldetail.fname" required/></td> <td> <input type="text" class="form-control" ng-model="personaldetail.lname" required/></td> <td> <input type="email" class="form-control" ng-model="personaldetail.email" required/></td> </tr> </tbody> </table> <div class="form-group"> <input ng-hide="!personaldetails.length" type="button" class="btn btn-danger pull-right" ng-click="remove()" value="remove"> <input type="submit" class="btn btn-primary addnew pull-right" value="add new"> </div> </form> </div> </div> </div> </div> </div>
---controller----
var app = angular.module("myapp", []); app.controller("listcontroller", ['$scope', function($scope) { $scope.personaldetails = [ { 'fname':'muhammed', 'lname':'shanid', 'email':'shanid@shanid.com' } 'email':'john@john.com' ]; $scope.addnew = function(personaldetail){ $scope.personaldetails.push({ 'fname': "", 'lname': "", 'email': "", }); }; $scope.remove = function(){ var newdatalist=[]; $scope.selectedall = false; angular.foreach($scope.personaldetails, function(selected){ if(!selected.selected){ newdatalist.push(selected); } }); $scope.personaldetails = newdatalist; }; $scope.checkall = function () { if (!$scope.selectedall) { $scope.selectedall = true; } else { $scope.selectedall = false; } angular.foreach($scope.personaldetails, function(personaldetail) { personaldetail.selected = $scope.selectedall; }); };
}]);
the above code controller function. json response should show @ end: { [{'fname':'muhammed', 'lname':'shanid','email':'shanid@shanid.com'} && {'fname':'muhammed', 'lname':'shanid','email':'shanid@shanid.com'} }
Comments
Post a Comment