0

I have list of checkbox .based on checkbox select offers is coming everything is working fine.i have added my code below 

function Test1Controller($scope) {
  
    var serverData = ["Samsung Galaxy Note", "Samsung Galaxy S6", "Samsung Galaxy Avant","Samsung Galaxy Young"];
    $scope.items= [] ;

    for(var i=0;i<serverData.length;i++)
    {
        var modal = {
        name:serverData[i],
        selected:false
        };  
		
        $scope.items.push(modal);        
    }
    //----------------------------Our Shop Offers----------------------------------------
    $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.selection = [];

      $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);
		
    };
	//---------------------------------------------------------------------------------------
     $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-model="item.selected"  ng-checked="selection.indexOf(item) > -1" 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>

here when i open page nothing is checked in that checkbox list.my expectation when i come to this page it should check already selected value is there or not if it's there selected value should checked in that checkbox list. for example selected value Samsung Galaxy S6.in that checkbox list it should be checked .how to make this work pls some one help me out .i have tried but its not working for me i have modified my code but it's not working

//var selectedvalue = window.localStorage.getItem("selectedvalue");
    // here selected value Samsung Galaxy S6
    var selectedvalue="Samsung Galaxy S6";

here i have pushed selected value true but it's not working 

for(var i=0;i<serverData.length;i++)
    {
        var modal = {
        name:serverData[i],
        selected:false
        };  
        if (selectedvalue.indexOf(serverData[i]) >= 0 || null)
        {
                        modal.selected = true;

        }
        $scope.items.push(modal);        
    }

demo here Samsung Galaxy S6 is checked means dropdown should come bcoz Samsung Galaxy S6 has offer

Improve this question
4
  • use the isselected model property to identify if the checkbox is checked Commented Dec 11, 2015 at 14:57
  • pls update my fiddle Commented Dec 11, 2015 at 15:15
  • done. jsfiddle.net/0heruyep/20 Commented Dec 11, 2015 at 15:24
  • if Samsung Galaxy S6 is checked dropdown should come bcoz Samsung Galaxy S6 has offer Commented Dec 11, 2015 at 15:26

1 Answer 1

Reset to default
1

Just use the ng-checked directive like this:

ng-checked="item.selected"

You should not combine ng-model and ng-checked. From the docs:

Note that this directive should not be used together with ngModel, as this can lead to unexpected behavior.

Of course you can also add the selected item to the selections array instead of having an additional selected flag on each item. I would prefer this solution because it eliminate unnecessary redundancy.

Make sure you set selections to [] a the beginning and add each selected item:

if (selectedvalue.indexOf(serverData[i]) >= 0 || null) {
    selection.push(modal);
}
Improve this answer
Sign up to request clarification or add additional context in comments.

8 Comments

i have updated its not working .pls update my fiddle
no its not working properly .if Samsung Galaxy S6 is checked means one dropdown should come becoze Samsung Galaxy S6 have some offers pls uncheck and check Samsung Galaxy S6 check then oly you will come to know
ok, now its also using the toggleSelection method. This works: jsfiddle.net/0heruyep/23
after submit i how can i get checked checkbox values .now i am geting [] object in line no 106
before it was passing checked checkbox values now its not working .bcoz you removed that functions.can you help me out
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.