AngularJS Multiselect checkbox dropdown Issue

Question

I have a pop-up with multi-select drop down.

Multi-Select Dropdown Code

<select name="edit_tags" class="form-control" id="advisor_article_tagsx" multiple="" 
   required ng-model="article_selected" ng-options="article_service as article_service.name for article_service in article_services">
</select>

There is an array article_services which is used in multi-select, I am fetching this array from below code.

$http.get(url + 'service_provided').
     then(function (response) {
         $scope.article_services = response.data.service_provided;
         //$scope.article_selected = [$scope.article_services[0], $scope.article_services[1]];
});

Now I want that when I click on Edit Button with ng-click="advisor_article_edit()" to open pop-up, my multi-select checkbox comes with some selection. I want that Select must be work in below function but unfortunately it doesn't work.

$scope.advisor_article_edit = function () {
        // I need selection work from here. But it doesn't.
        $scope.article_selected = [$scope.article_services[3]];
 }

Gaurav Srivastava · Accepted Answer · 2017-08-10 16:41:50Z

1

It should work, like in the snippet.:-

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  
  $scope.cars = [{id:1, name: 'Audi'}, {id:2, name: 'BMW'}, {id:1, name: 'Honda'}];
  $scope.advisor_article_edit = function () {       
        $scope.article_selected = [$scope.cars[1]];
  }
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
  
<select name="edit_tags" class="form-control" id="advisor_article_tagsx" multiple="" 
   required ng-model="article_selected" ng-options="car as car.name for car in cars">
</select>

<button ng-click="advisor_article_edit()">Edit</button><br>
Selected : {{article_selected}}
</div>

Working Plunkar Link

edited Aug 10, 2017 at 16:41

answered Aug 10, 2017 at 13:44

Gaurav Srivastava

3,2323 gold badges20 silver badges37 bronze badges

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

1 Comment

John Brad Over a year ago

I am trying like this. plnkr.co/edit/N8DOFmrfIQiNedAlnaK2?p=preview

Ben Taliadoros · Accepted Answer · 2017-08-10 12:31:29Z

1

I believe you need to trigger the click:

var cb = angular.element('some-selector');
cb.triggerHandler('click');

This should be done in a directive as it's dom manipulation

answered Aug 10, 2017 at 12:31

Ben Taliadoros

9,73119 gold badges68 silver badges106 bronze badges

2 Comments

John Brad Over a year ago

If you don't mind then can you give complete solution here ??

Ben Taliadoros Over a year ago

I can't as I'm at work but if you create a jsFiddle or CodePen or something with your issue I can try to fix it

Collectives™ on Stack Overflow

AngularJS Multiselect checkbox dropdown Issue

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related