how to use indexof in array set in angularjs

Question

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script>
var app = angular.module('myApp', []);
app.controller('myctrl', function($scope) {
    $scope.state = [{name:'TamilNadu', code:1}, {name:'Kerala', code:2}, {name:'Karnataka', code:3}];
    $scope.onChange = function() {
            var a = this.drop.state;  }
});
</script>
<body>

<div ng-app="myApp" ng-controller="myctrl">
State : 
<select id="stat" ng-model="drop.state" ng-change="onChange()">
<option ng-repeat = "x in state"> {{x.name}} </option>
<select>
</div>
</body>

In this code, I can be able to get the selected value from the textbox in the variable a. Now, I need to get the code value of the name selected. Is it possible using indexof(). And I need it in dynamic ie., when the 'state' is selected I need that corresponding 'code' from the array set.

Joao Pedro Milhome · Accepted Answer · 2017-06-07 14:15:47Z

1

<option value="{{x}}" ng-repeat = "x in state"> {{x.name}} </option>

If you add the value on your Option, you may get the complete object, and accessing the code and the Value

answered Jun 7, 2017 at 14:15

Joao Pedro Milhome

113 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sachila Ranawaka · Accepted Answer · 2017-06-07 13:41:12Z

0

you can assign code as value to option

<option ng-repeat = "x in state" ng-value="x.code"> {{x.name}}

Demo

var app = angular.module('myApp', []);
app.controller('myctrl', function($scope) {
    $scope.drop = {}
    $scope.state = [{name:'TamilNadu', code:1}, {name:'Kerala', code:2}, {name:'Karnataka', code:3}];
    $scope.onChange = function() { 
            var a = $scope.drop.state
            console.log(a)
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myctrl">
State : 
<select id="stat" ng-model="drop.state" ng-change="onChange()">
<option ng-repeat = "x in state" ng-value="x.code"> {{x.name}} </option>
</select>
</div>

edited Jun 7, 2017 at 13:41

answered Jun 7, 2017 at 13:38

Sachila Ranawaka

41.6k8 gold badges62 silver badges87 bronze badges

2 Comments

Tik Over a year ago

to be more angular specific it should be <option ng-repeat = "x in state" ng-value="x.code"> {{x.name}} </option>

Daemon_Demon Over a year ago

Thanks for the solution

yBrodsky · Accepted Answer · 2017-06-07 13:40:00Z

0

Even though the other answer is valid, this is the right way to go about it:

<select id="stat" ng-model="drop.state" ng-options="x.code as x.name for x in state" ng-change="onChange()">
  <option value="">Select a value</option>
</select>

If the purpose of the ng-change was to get the state code, this way it's not needed. Your ng-model will be equal to the selected state code.

answered Jun 7, 2017 at 13:40

yBrodsky

5,0614 gold badges24 silver badges35 bronze badges

Comments

anoop · Accepted Answer · 2017-06-07 13:48:21Z

You can bind data to a single property., and can access both. with preferred ng-options .

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script>
  var app = angular.module('myApp', []);
  app.controller('myctrl', function($scope) {
    $scope.state = [{
      name: 'TamilNadu',
      code: 1
    }, {
      name: 'Kerala',
      code: 2
    }, {
      name: 'Karnataka',
      code: 3
    }];
    $scope.onChange = function() {     
     alert(this.drop.state.name);  
     alert(this.drop.state.code);  
    }
  });
</script>

<body>

  <div ng-app="myApp" ng-controller="myctrl">
    State :
    <select id="stat" ng-model="drop.state" ng-options= "x as x.name for x in state" ng-change="onChange()"> </select>

</div>
</body>

Collectives™ on Stack Overflow

how to use indexof in array set in angularjs

4 Answers 4

Comments

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related