2015-12-12 119 views
1

我有一些提供複選框的列表,當我提交必須得到檢查複選框值。我已經嘗試過,但它不工作我已經添加我的代碼below.now我得到了提供消息ID,但我沒有得到檢查checkbox值後提交pls幫幫我。 demo如何使用angularjs提交後檢查複選框的值?

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]); 
 
        } 
 
       } 
 
      } 
 
     } 
 
\t \t console.log($scope.offers); 
 
    }; 
 
    
 
\t var selectedvalue = window.localStorage.getItem("selectedvalue"); 
 
\t // 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 
 
     }; 
 
\t \t 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) ; 
 
    } 
 
} \t
<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>

回答

0

好像你是想遍歷$scope.selection而非$scope.items

Updated Example

變化:

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

到:

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

除去if條件語句,因爲在$scope.selection所有元素都已經檢查。


或者,您也可以只使用.map()方法來創建數組:

Updated Example

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

由於其工作 –

+0

當我選擇三星Galaxy S6 drodown快到了,我已經選擇也提供其working.when我刪除三星Galaxy S6下拉不來,但是當我提交我得到該提供ID。 –