CODEWITHSUNDEEP
angularjsangularjs-directiveangular-ui
user686483
user686483

Reputation: 1506

Error: $apply already in progress

I'm using this http://plnkr.co/edit/sqXVCJ?p=preview on my Angular UI accordion. I've put the directive attribute on the anchor (which is in the template) and I've overriden the template to remove the ng-click="isOpen = !isOpen" and replaced it with a function call "callSubmit". All the accordions have views loaded into them, all of the views have forms as well. The purpose of the callSubmit function is to submit the form which works fine but I get the error above.

I've read through various posts regrding adding the $timeout service (which didnt't work) and adding the safe apply method which gave me recursion and digest errors.

I'm not sure what else I can try, the function works fine, but I just keep getting that error. 

!--- button
<button type="submit" class="btn btn-default hidden" id="btnSubmit_step1" ng-click="submitForm()">Trigger validation</button>

!-- function

     $scope.callSubmit = function() {

       document.getElementById('btnSubmit_step1').click();

     };

edit: The reason that I have been triggering the button click from the controller is due to the fact that the form method is in another scope & a different controller.

So if I use broadCast from the rootScope like below. I get the broadcast event to the other controller without issue. The controller that receives the broadcast has the form in it's scope but when I try to execute the function I get nothing, no form submission at all. 

$$scope.callSubmit = function() {           
  //document.getElementById('btnSubmit_step1').click();
 $rootScope.$broadcast('someEvent', [1,2,3]);
};


$scope.$on('someEvent', function(event, mass) {
 $scope.submitForm();
});

Upvotes: 0

Views: 1182

Answers (1)

BenCr
BenCr

Reputation: 6052

Don't click the button from a controller.

$scope.callSubmit = function() {
   $scope.submitForm();
};

The documentation is clear...

Do not use controllers to:

Manipulate DOM — Controllers should contain only business logic. Putting any presentation logic into Controllers significantly affects its testability. Angular has databinding for most cases and directives to encapsulate manual DOM manipulation.

Clicking a button on a page is manipulating the DOM.

Upvotes: 2

Related Questions