How to condition on change of option in angular select with external json values?

Question

I have dropdown inside my view that is being populated from factory(AJAX) API in other words I have a JSON formatted data to populate the dropdown(id,display_text) as follows:

My View

<select class="form-control padding-7" ng-model="selConnData.repeatSelect" ng-options="types.id as types.text for types in selConnData.connList" ng-change="updateConType('{{types.val}}')">
        </select>

My Controller

                     $scope.selConnData = {
                        repeatSelect: null
                     };

                    getConnectionList.connectionList().then(function(response){
                    console.log(JSON.stringify(response.data));
                    var tempConnections = {};
                    var tempConnList = [];
                    angular.forEach(response.data.result, function(value, key) {
                        tempConnList.push({
                            id: value.Id,
                            text: value.Name,
                            val: "thrLoc" 
                            });
                    });
                    $scope.selConnData.connList = tempConnList;
                });

My Factory

    app.factory('getConnectionList', function($http) {
var resultant = {};

resultant.connectionList = function(){
        return $http({
            method: 'GET',
            url: "xyz"
        });
    }

    return resultant;

});

My Final JSON o/p will be in:

                           [{
                                    id: 1,
                                    text: "Connection 1",
                                    val: "8010"
                                },{
                                    id: 2,
                                    text: "Connection 3",
                                    val: "8030"
                                },{
                                    id: 9,
                                    text: "Connection 4",
                                    val: "8040"
                                }]

Now, my dropdown option will be like

<select>
  <option value="1">Connection 1</option>
  <option value="2">Connection 3</option>
  <option value="9">Connection 4</option>
</select>

Up to here,everything is working, my ng-model gives me selected value,but i need a condition to run where on change of options I will check if(8010) do-something elseif(8030) do-something elseif(8040) do-something.

P.S: I tried ng-attr but not a best case(couldn't get the values out)

try <select class="form-control padding-7" ng-model="selConnData.repeatSelect" ng-options="types.val as types.text for types in selConnData.connList" ng-change="updateConType(selConnData.repeatSelect)"> </select> — Fracedo
– Fracedo, Commented Nov 5, 2015 at 23:11
In this case, i will not be able to fetch types.id which is needed for me based on change. — varun kumar
– varun kumar, Commented Nov 6, 2015 at 5:59

Fracedo · Accepted Answer · 2015-11-06 12:02:48Z

1

If you want both id and value, then you can try something like this,

<select class="form-control padding-7" ng-model="select" ng-options="{id:types.id,val:types.val} as types.text for types in options" ng-change="updateConType(select)">
        </select>

Plunker link. .

answered Nov 6, 2015 at 12:02

Fracedo

6268 silver badges23 bronze badges

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

1 Comment

varun kumar Over a year ago

yes, this is the correct answer for others if they are wondering. thnx @Mahe

Collectives™ on Stack Overflow

How to condition on change of option in angular select with external json values?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related