Angularjs material or angularjs store multiple select dropdown data in webservice

Question

I am using Angular material and I am stuck on multi selection dropdown , where I was selecting more than one options and on ng-change I am calling function which will get id of every option and I will compare API id but As I select it will provide data in function like In first option selection 123456 In second option selection 123456,456231

In Third option selection 123456,456231,471258

so whenever I do compare It goes inside the condition only once and not more even I tried to split It gives error and do nothing.

<md-select ng-model="$parent.follower" placeholder="Select Person" multiple="true" ng-change="getFollowers(follower)">             
     <md-option ng-repeat="follower in followers" value="{{follower.id}}"> {{follower.full_name}}</md-option>
   </md-select>

So Let me know how to handle this situation, if anyone have experience and very well Please let me know.

Thanks Shivam

Can you provide plunker or fiddle, so that problem could be easily understandable — Shubham Nigam
– Shubham Nigam, Commented Jul 15, 2015 at 9:17
ng-change call function and that function provide id of option suppose I select apple , It will provide 123 id then I select second option then console show 123,456 same as follow for rest of all. — Code_S
– Code_S, Commented Jul 15, 2015 at 10:03
ok so if you are getting ids in array then next what you want to do? — Shubham Nigam
– Shubham Nigam, Commented Jul 15, 2015 at 10:07
ok let me give pure angularjs multiple selection that can be post on webservice ,Please — Code_S
– Code_S, Commented Jul 15, 2015 at 10:08
No , not in array simple like 123,4565 if I select single option then 123 , and again select two option then 1223,456 in function — Code_S
– Code_S, Commented Jul 15, 2015 at 10:10

Shubham Nigam · Accepted Answer · 2015-07-15 10:52:23Z

1

I have created Codepen for you where you can see the value changing each time As I dont know you data format I used a demo one

HTML

<div ng-controller="AppCtrl as ctrl" class="md-padding selectdemoBasicUsage" ng-app="MyApp">
  <div>
    <h1 class="md-title">Enter an address</h1>
    <div layout="row">
      <md-input-container>
        <label>Street Name</label>
        <input type="text">
      </md-input-container>
      <md-input-container>
        <label>City</label>
        <input type="text">
      </md-input-container>
      <md-select placeholder="State" ng-model="ctrl.userState" multiple="true" ng-change='changeValue(ctrl.userState)'>
        <md-option ng-repeat="state in ctrl.states" value="{{state.abbrev}}">{{state.abbrev}}</md-option>
      </md-select>
    </div>
  </div>
</div>

Angularjs Code

      'use strict';
      angular
          .module('MyApp')
          .controller('AppCtrl', function($scope,$http) {
            this.userState = '';
            this.states = ('AL AK AZ AR CA CO CT DE FL GA HI ID IL IN IA KS KY LA ME MD MA MI MN MS ' +
                'MO MT NE NV NH NJ NM NY NC ND OH OK OR PA RI SC SD TN TX UT VT VA WA WV WI ' +
                'WY').split(' ').map(function (state) { return { abbrev: state }; });
     $scope.changeValue=function(value){
        console.log(value);
     $http.post(//url).then(function(response){
//handle response here
     });
  }    
  });

Codepen for working solution http://codepen.io/anon/pen/WvygLZ

answered Jul 15, 2015 at 10:52

Shubham Nigam

3,96821 silver badges33 bronze badges

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

7 Comments

Code_S Over a year ago

ok , suppose I want to store data in webservice like-- "followers":[{"id":"123","name":"John Sina"}] so how to send them , I am trying like data :{ followers[id ]== data } but not working

Shubham Nigam Over a year ago

followers[0].id === data will solve your problem because object is inside array

Code_S Over a year ago

w3schools.com/json/tryit.asp?filename=tryjson_objectarray_4 take a look here , suppose I want to add one or more first and last name so using $http how would I store , usually I used format like data:{field_name : datasss} but as I mentioned above comment for (followers":[{"id":"123","name":"John Sina"}] ) , so for that do you have sysntax to stor data, Please let me know.

Code_S Over a year ago

every time store , It will run correct followers[0].id ===data ?

Shubham Nigam Over a year ago

You can send complete array and you can check like aangular.forEach(followers,function(follower){ if(follower.id===data){//value} });

|

Collectives™ on Stack Overflow

Angularjs material or angularjs store multiple select dropdown data in webservice

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related