How to trigger form submit programmatically in AngularJS?

Question

From Angular\'s documentation it follows that ngSubmit is a preferred way of submitting a form. All pending operations are immediately finished and $submitted f

Answer 1

Just use event .triggerHandler('submit') on form element.

myApp.directive("extSubmit", ['$timeout',function($timeout){
    return {
        link: function($scope, $el, $attr) {
            $scope.$on('makeSubmit', function(event, data){
              if(data.formName === $attr.name) {
                $timeout(function() {
                  $el.triggerHandler('submit'); //<<< This is Important

                  //equivalent with native event
                  //$el[0].dispatchEvent(new Event('submit')) 
                }, 0, false);   
              }
            })
        }
    };
}]);

Look at http://jsfiddle.net/84bodm5p/

Answer 2

You can modify your directive code a bit like:

function wuSubmit() {
    return {
        require: 'form',
        restrict: 'A',
        link: function(scope, element, attributes) {
            var scope = element.scope();
            if (attributes.name && scope[attributes.name]) {
                scope[attributes.name].$submit = function() {
                    // Parse the handler of submit & execute that.
                    var fn = $parse(attr.ngSubmit);
                    $scope.$apply(function() {
                        fn($scope, {$event: e});
                    });
                };
            }
        }
    };
}

Here you don't have to add wu-submit everywhere. ng-submit will work.

Hope this helps!

Answer 3

app.directive("form", function(){
     return {
        require: 'form',
        restrict: 'E',
        link: function(scope, elem, attrs, form) {
            form.doSubmit = function() {
                form.$setSubmitted();
                return scope.$eval(attrs.ngSubmit);
            };
        }
    };
});

Html:

<form name="myForm" ng-submit="$ctrl.submit()" novalidate>

Then call in controller

$scope.myForm.doSubmit();