CODEWITHSUNDEEP
javascriptangularjs
Prashanth Harish
Prashanth Harish

Reputation: 178

How to get ID from select box using AngularJS

I am new to Angular JS. I have the following <select> options, and I have to send id of the community i.e., x.community_type_id to fetch subcommunity.

<select>
  <option ng-repeat="x in myData" ng-click="sendID({{ x.community_type_id }})">{{ x.community_Type }}</option>
</select>

Right now I am using the following code to fetch data from web service to select option.

var app = angular.module('EntityApp', []);
    app.controller('EntityAppCntroller', function($scope, $http) {  
    $http.get("http://111.222.22.333:1081/apartment/community/type/list")
    .then(function (response) {
        $scope.myData = response.data.type;
    }); 

    $scope.sendID = function (id) {
        alert(langKey);
    }
});

I want to send x.community_type_id to a web service. That webservice url is like this :

http://11.338.41.149:8481/apartment/register/sub/community/type

Upvotes: 1

Views: 864

Answers (4)

Hadi
Hadi

Reputation: 17299

Try like this 

 <select ng-model="model" ng-options="x.community_type_id as    
     x.community_Type for x in myData" ng-click="sendID(model)">
 <option ></option>
 </select>

Upvotes: 0

Yangshun Tay
Yangshun Tay

Reputation: 53169

In Angular, when an attribute starts with ng-, it is evaluated as JavaScript, hence you can do away with the double curly braces:

<select>
  <option ng-repeat="x in myData" ng-click="sendID(x.community_type_id)">{{ x.community_Type }}</option>
</select>

Upvotes: 2

Akashii
Akashii

Reputation: 2281

try this html

 ng-click="sendID( x.community_type_id )"

js

  $scope.sendID = function (id) {
         $http({
          method:'GET',
          url:'yoururl'+id,
          data:{'id':id}
             ///
})        
     }

Upvotes: 0

Sachila Ranawaka
Sachila Ranawaka

Reputation: 41437

remove the curly brackets in the ng-click function

<select>
<option ng-repeat="x in myData" ng-click="sendID( x.community_type_id )">{{ x.community_Type }}</option>
</select>

Upvotes: 0

Related Questions