Triggering chosen:open event in angular.js

Question

I'm using this chosen directive for angularjs. It's working great. But what I want to do is trigger chosen:open event to programatically open the dropdown which can be found in chosen documentation. Have anyone achieved this?

Thanks

Answer 1

You could enhance this directive, so it listens to custom events, that you define per dropdown. This answer about Extending Angular Directives explains how this works.

module.directive('chosen', function(){
  return {
    restrict:"A",
    link: function($scope,$element,$attrs){
        var event = $attrs.openOn;
        $scope.$on(event,function(){
            $element.trigger("chosen:open");
        });
    }
  }
});

<button ng-click="show('event:a')">open</button>
<select chosen open-on="event:a">    

$scope.show = function(event) {
  $scope.$broadcast(event);
};

http://jsfiddle.net/QbRAY/1/