使用angularjs提交后如何获取选中的复选框值？

Question

I have list of checkbox with some offer when I submit have to get checked checkbox values .I have tried but its not working I have added my code below.now I got offer message id but I didt get checked checkbox values after submit pls help me out. demo

 function Test1Controller($scope) { var storeid = window.localStorage.getItem("storeid"); var serverData = ["Samsung Galaxy Note", "Samsung Galaxy S6", "Samsung Galaxy Avant","Samsung Galaxy Young"]; $scope.items= [] ; $scope.selection = []; $scope.offers = [{ id: "as23456", Store: "samsung", Offer_message:"1500rs off", modalname: "Samsung Galaxy Young" },{ id: "de34575", Store: "samsung", Offer_message:"20% Flat on Samsung Galaxy S6", modalname: "Samsung Galaxy S6" },] $scope.toggleSelection = function toggleSelection(item) { $scope.gotOffers=[]; var idx = $scope.selection.indexOf(item); // is currently selected if (idx > -1) { $scope.selection.splice(idx, 1); } // is newly selected else { $scope.selection.push(item); } for(var i=0;i<$scope.selection.length;i++){ for(var j=0;j<$scope.offers.length;j++){ console.log($scope.selection[i].name +" "+ $scope.offers[j].modalname) if( $scope.selection[i].name == $scope.offers[j].modalname){ var idx = $scope.gotOffers.indexOf($scope.offers[j].Offer_message); if(idx == -1){ console.log("inside idx") $scope.gotOffers.push($scope.offers[j]); } } } } console.log($scope.offers); }; var selectedvalue = window.localStorage.getItem("selectedvalue"); // here selected value Samsung Galaxy S6 var selectedvalue="Samsung Galaxy S6,Samsung Galaxy Young"; for(var i=0;i<serverData.length;i++){ var modal = { name:serverData[i], selected:false }; if (selectedvalue.indexOf(serverData[i]) >= 0 || null){ $scope.toggleSelection(modal); } $scope.items.push(modal); } //----------------------------Our Shop Offers---------------------------------------- $scope.check = function(){ var checkedItems = []; console.log($scope.offerSelected) for(var i=0;i<$scope.items.length;i++){ if($scope.items[i].selected){ checkedItems.push($scope.items[i].name); } } console.log(checkedItems) ; } } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script> <div ng-app> <div ng-controller="Test1Controller" > <div ng-repeat="item in items"> <input type="checkbox" ng-checked="selection.indexOf(item) >= 0" ng-click="toggleSelection(item)"/> {{item.name}} </div> <select ng-show="gotOffers.length > 0" ng-model="offerSelected"> <option ng-repeat="offer in gotOffers" value="{{offer.id}}">{{offer.Offer_message}}</option> </select> <input type="button" name="submit" value="submit" ng-click="check()"/> </div> </div> 

Answer 1

It seems like you are wanting to iterate over $scope.selection rather than $scope.items .

Updated Example

Change:

var checkedItems = [];$scope.selection
for (var i = 0; i < $scope.items.length; i++) {
  if ($scope.items[i].selected) {
    checkedItems.push($scope.items[i].name);
  }
}

to:

var checkedItems = [];
for (var i = 0; i < $scope.selection.length; i++) {
  checkedItems.push($scope.selection[i].name);
}

The if conditional statement was removed since all the elements in $scope.selection are already checked.

---

Alternatively, you could also just use the .map() method to create the array:

Updated Example

var checkedItems = $scope.selection.map(function(checkbox) {
  return checkbox.name;
});