CODEWITHSUNDEEP
angularjs
Jay
Jay

Reputation: 9499

Dropdown multiselect - Events triggering all time

I am using the Angular dropdown multi select module. http://dotansimha.github.io/angularjs-dropdown-multiselect/#/

And I use its events feature but it gets triggered all time even when I click any where else other than the drop down.

Plunkr :

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

Javascript

var jayApp = angular.module('jayApp',['angularjs-dropdown-multiselect']);

jayApp.controller('jayController', function($scope) {

    $scope.example1model = []; 
    $scope.example1data = [ {id: 1, label: "David"}, {id: 2, label: "Jhon"}, {id: 3, label: "Danny"}];


    // MultiSelect Drop down select - Event
    $scope.onItemSelect = function(property) {
    console.log('selecting > ' +property);
    }

    $scope.onItemDeselect = function(property) {
    console.log('deselecting : ' +property);
    }

})

HTML

Drop down : 

    <div ng-dropdown-multiselect="" options="example1data" selected-model="example1model" events="onItemSelect(example1model); onItemDeselect(example1model)">

    </div>
  <br>
  User <input type='text' name='dummy'> <br><br>
  Password <input type='password' name='pass'> <br><br>

  <input type='submit'>

</body>

Upvotes: 1

Views: 11317

Answers (3)

Ricky sharma
Ricky sharma

Reputation: 761

You can inline it like this

<div ng-dropdown-multiselect
     options="regions_options"
     selected-model="regions_selected"
     events="{ onItemSelect: someFunction }">

or even have multiple callbacks inline by extending the events object, like so:

events="{ onItemSelect: someFunction, onInitDone: functionToBeExecutedOnInitDone }"

Notice that we are referencing the function, not calling it. someFunction - without ().

Upvotes: 0

Nico
Nico

Reputation: 411

The events attribute of directive ng-dropdown-multiselect expects a JS object, instead of events="onItemSelect(example1model); onItemDeselect(example1model)". See the full solution in this Plunkr: http://plnkr.co/edit/lsaLqUYm4haN1qdR6Omt?p=preview

Upvotes: 4

ccjmne
ccjmne

Reputation: 9628

Yes, it indeed works like that. I believe it smells, but that's how it is.
Now, is that really a problem for you? You can still probably work with this as it is. Although, I'd recommend creating an issue ticket on their GitHub project.

On the other hand, you're probably expecting this to work like an onChange event. You might be glad to know that there currently is a pending PULL request for actually adding a support for onChange event in AngularJS Dropdown Multiselect: here's a link to the pull request I'm talking about.

If you can't wait for this feature to be merged, just check out the Master branch on PawelDecowski's forked project (link).

Upvotes: 2

Related Questions