Neither ng-submit or ng-click responding to submit button in a form

Problem

I'm trying to make a very simple login form in angularjs, but it seems that neither the ng-submit() nor the ng-click directive seems to be working.

I've created a very basic plunker example here: http://plnkr.co/edit/BrLIxSZggZofCBoZpjT4?p=preview In which either/both the ng-click or the ng-submit should open a simple alert window with an 'a' letter. However nothing happens when I click on the sign in button. What's more interesting, that if I change ng-app to ng-app="test" then the form get submitted but the alert doesn't get called either.

What am I doing wrong?

The basic example:

<head>
  <script data-require="angular.js@1.2.9" data-semver="1.2.9" src="http://code.angularjs.org/1.2.9/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-app>
  <!-- Login -->
  <form data-title="Sign in" data-value="login" class="tab-pane" name="login" 
   ng-submit="alert('a')" ng-controller="Ctrl">

    <input type="text" name="username" value="" placeholder="Username" ng-model="model.username" ng-minlength="3" required autocapitalize="false" />
    <input type="password" name="password" value="" placeholder="Password" ng-model="model.password" required autocapitalize="false" autocorrect="false" />
    <input type="submit" ng-click="alert('a')" name="login" value="Sign in" />

  </form>
  <!-- / Login -->
</body>

</html>
Problem courtesy of: geujv

Solution

ng-submit directive invokes a function which should be in the controller. The ng-submit directive will be triggered provided the form fields are valid

Form/HTML

<form data-title="Sign in" data-value="login" class="tab-pane" name="login" 
   ng-submit="submit()" ng-controller="Ctrl">
    <input type="text" name="username" value="" placeholder="Username" ng-model="model.username" ng-minlength="3" required autocapitalize="false" />
    <input type="password" name="password" value="" placeholder="Password" ng-model="model.password" required autocapitalize="false" autocorrect="false" />
    <input type="submit" name="login" value="Sign in" />
</form>

Controller

function Ctrl($scope) {
    $scope.model = {};
    $scope.submit = function(){
        alert('a');
    }
}

Plunkr

Solution courtesy of: dcodesmith

Discussion

There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.