How to programmatically submit a form with AngularJS

You can subscribe to a "submit" from your progress-button directive and broadcast/emit that event from triggered actions. I put together a quick sample with a regular input, text area, and a progress-button that disabled. The controller.submit and onEnter directives both raise the event of interest that progress-button subscribes to (jsfiddle).

JavaScript:

var mod = angular.module("myApp", []);

mod.controller("MainController", function ($scope, $rootScope) {
    var isSubmitted = false;
    $scope.controller = {};
    $scope.controller.submit = function () {
        if (!isSubmitted) {
            alert("controller.submit called");
            $rootScope.$broadcast("progressButton.submit");
        }
        isSubmitted = true;
    }
});

mod.directive("onEnter", function ($rootScope) {
    return {
        restrict: "A",
        scope: {onEnter: "&"},
        link: function (scope, element, attrs) {
            element.on("keypress", function (event) {
                var whichKey = event.which;

                //enter pressed
                if (whichKey === 13) {
                    scope.onEnter();
                    $rootScope.$broadcast("progressButton.submit");
                }
            });
        }
    }
});

mod.directive("progressButton", function ($timeout) {
    return {
        restrict: "E",
        template: '<button ng-transclude></button>',
        transclude: true,
        replace: true,
        link: function (scope, element, attrs) {
            //function to disable the button when clicked or progressButton.submit event
            //is broadcast.
            var disableButton = function () {
                //disabling after a timeout so submit handler can be called
                $timeout(function () { 
                    element.attr("disabled", true);
                }, 0);
            };

            if (!attrs.type) {
                element.type = "submit";
            }
            else {
               element.type = attrs.type;
            }

            //disable the button when form is submitted or explicitly clicked.
            element.on("click", function () {
                disableButton();
            });

            //disable the button when progressButton.submit event is received.
            scope.$on("progressButton.submit", function () {
                    disableButton();
            });
        }
    }
});

HTML:

<div ng-app="myApp" ng-controller="MainController">
    <form ng-submit="controller.submit()">
        <input ng-model="data.name"><br>
        <textarea on-enter="controller.submit()"></textarea><br>
        <progress-button type="submit">Submit Me</progress-button>
    </form>
</div>

I've managed to achieve this by adding $submit method to FormController:

module.directive('form', function($parse) {
    return {
       require: 'form',
       restrict: 'E',
       link: function(scope, element, attrs, formController) {          
           formController.$submit = $parse(attrs.ngSubmit);
       }
    };
});

You can then invoke form's ng-submit expression by calling $scope.myForm.$submit($scope) from the controller.

The $parse in aikoven's answer didn't seem to be working for me, so I modified it to use scope.$eval instead. I also added form.$setSubmitted() so the form properly gets the .ng-submitted class after you submit it.

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