how to check checkbox whether true or false in angularjs using index value

Question

I have checkbox inside the ng-repeat I want check whether checkbox is checked or not using their index value

html

<div ng-repeat="Name in Names">
    <input type="checkbox" 
           ng-change="checkchange(Name .MaterialStream, $index)"
           ng-model="Name.MaterialStream" />
</div>

controller

$scope.checkchange=function(index){
      $scope.Names[index].active='true';
}

Now I get correct value when I check the checkbox. I have to get active value is true but I have check means active should be change into false in my case it's true here I attached my code help how to do this.

What exactly are you trying to achieve here? Also is there a reason you pass the `$index` instead of the actual model you want to change? — Philipp Meissner, May 09 '17 at 09:53
when i check the checkbox i want to show true else false using index — jose, May 09 '17 at 09:54

Pengyy · Accepted Answer · 2017-05-09T10:30:24.320

2

you can bind Name.active directly without using ng-repeat.

<div ng-repeat="Name in Names">         
  <input type="checkbox" ng-model="Name.active" />
</div>

Since you are binding Name.MaterialStream to checkbox, you can set Name.active based on it in ng-change.

$scope.checkchange=function(index){
  $scope.Names[index].active = $scope.Names[index].MaterialStream;
}

edited May 09 '17 at 10:30

answered May 09 '17 at 10:03

Pengyy

37,383
15
83
73

there is no way show any new scope value like active? – jose May 09 '17 at 10:18
@jose In your code, by `$scope.Names[index].active='true';` you are trying to update `active` property. isn't it? – Pengyy May 09 '17 at 10:22
$scope.Names[0].active=true/false i create dynamic like this @Pengyy – jose May 09 '17 at 10:24
@jose sorry.....not at all. maybe we should chat. http://chat.stackoverflow.com/rooms/143769/angularjs-checkbox-ng-click – Pengyy May 09 '17 at 10:37
http://stackoverflow.com/questions/43972984/how-to-store-service-in-dropdown-after-page-refreshing-using-angularjs @Pengyy help – jose May 15 '17 at 06:51
still No Pengyy – jose May 15 '17 at 09:12
@jose ok, i'll take a look for it. – Pengyy May 15 '17 at 09:13
@help Penyy http://stackoverflow.com/questions/44109725/how-to-splice-the-array-based-on-paritcular-value-using-angularjs – jose May 22 '17 at 09:46

score 1 · Answer 2 · edited Jul 16 '17 at 03:03

1

To get the value of your checkbox, you simply have to return the model itself.

HTML

<div ng-repeat="Name in Names">
    <input type="checkbox" ng-change="checkchange($index)"
           ng-model="Name.MaterialStream" />
</div>

JS

$scope.checkchange=function(index){
    return $scope.Names[index].MaterialStream;
}

Note that I removed the first argument you passed to the checkchange function as it wasn't used before. In fact, before you checked the index variable but it wouldn't hold the real $index-value.

edited Jul 16 '17 at 03:03

georgeawg

48,608
13
72
95

answered May 09 '17 at 10:01

Philipp Meissner

5,273
5
34
59

no @philip i need that active scope not use model name :( – jose May 09 '17 at 10:02
That `active` attribute does not hold the value of your model though. – Philipp Meissner May 09 '17 at 10:02
i create active scope in run time – jose May 09 '17 at 10:06
I really do not see the point what you want to achieve. Do you want to have the `active` attribute hold the models state (true/false)? If so, you just need to change the ng-model as described in @Pengyys answer. – Philipp Meissner May 09 '17 at 10:07
my ng-model is look like this how to i call ng-model="selection.id[BFMaterialStream.MaterialStream]" – jose May 09 '17 at 10:11
That is completely off from what you posted before. If you want to access `Name.active`, just set it like so. I think you should share all of your code or at least more parts of it, because otherwise I don't see a way to solve your problem completely. – Philipp Meissner May 09 '17 at 10:24

score 1 · Answer 3 · answered May 09 '17 at 10:02

ng-model is more than enough to store true false for checkbox, you don't require $index at all, but If you must do it by $index, then also you can utilize the ng-model.

See this Fiddle example out of your code.

In addition: in your above code, definition of checkchange() method doesn't accept the first argument, thats an issue. you shouldn't pass it if you not going to consume it.

score 0 · Answer 4 · edited Jul 16 '17 at 03:06

Here is your Solution . With working example

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.Names = [{value : true}, {value : true},{value : false},{value : false},{value : true}]
        $scope.toggleSelection = function(x,index,event) {
          // how to check if checkbox is selected or not
          //alert(index + ' is ' + event.target.checked);  
          $scope.Names[index].Active = $scope.Names[index].value;
        };
});

<body ng-app="myApp" ng-controller="myCtrl">
  <div ng-repeat="Name in Names">
   {{$index}}
   <input type="checkbox" id="" name="check_box" 
          value="{{x}}"
          ng-change="toggleSelection(x.value,$index,$event)"
          ng-model="Name.value" > {{Name.Active}}
  </div>
  
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

how to check checkbox whether true or false in angularjs using index value

html

controller

4 Answers4