CODEWITHSUNDEEP
javascriptangularjs
AlCode
AlCode

Reputation: 565

angular ng-selected, select the current parent $index

http://plnkr.co/edit/fwwAd4bn6z2vxVN2FUL7?p=preview

in the plunker you can see what i want, I want the 3 dropdown lists to have the values A,B,C and if i add a 4th it should have A,B,C,D and when you open the dropdown list you can select all the added letters. 

<option ng-repeat="n in characters" ng-selected="$index == $parent.$index">{{n}}</option>

So you should have ABC selected when you press ADD.. and it should STAY selected.. but it wont, how do i make it selected?

Upvotes: 0

Views: 1624

Answers (3)

KreepN
KreepN

Reputation: 8598

I modified your setup to dynamically build the existing options into your character collection and then dynamically add the dropdowns:

Plnkr Here

enter image description here

This is done via:

 $scope.characters = [];
 $scope.something = [{Name:"Obj1",Selected:"A"}, {Name:"Obj2",Selected:"B"},{Name:"Obj3",Selected:"C"}];

 angular.forEach($scope.something, function(obj, index) {
   $scope.characters.push(obj.Selected);
 });

 $scope.Add = function() {
   var sNewOption = String.fromCharCode(65 + $scope.characters.length);
   $scope.something.push({Name: "obj" + (parseInt($scope.characters.length) + 1), Selected: sNewOption});
   $scope.characters.push(sNewOption);  
 }

Upvotes: 0

bm1729
bm1729

Reputation: 2375

You should use the ng-options directive on your select.

HTML:

<div ng-app="app">
    <div ng-controller="mainController">
        <div ng-repeat="selected in selecteds track by $index">
            <select ng-model="selecteds[$index]" ng-options="character for character in characters">
            </select>
        </div>
        <button ng-click="addValue()">Add</button>
        <pre ng-bind="characters | json"></pre>
        <pre ng-bind="selecteds | json"></pre>
    </div>
</div>

JS:

angular.module('app', [])
.controller('mainController', function($scope) {
    $scope.characters = ["A", "B", "C"];
    $scope.selecteds = ["A", "B", "C"];
    $scope.addValue = function() { 
        var currGroup = String.fromCharCode(65 + $scope.characters.length);
        $scope.characters.push(currGroup);
    }
});

Working fiddle here: http://jsfiddle.net/ben1729/djy5ooed/

Upvotes: 1

Balram Khichar
Balram Khichar

Reputation: 95

You need to add value to options. Try this way

<option ng-repeat="n in characters" value="{{n}}" ng-selected="$index == $parent.$index">{{n}}</option>

Upvotes: 0

Related Questions