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="[email protected]" 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>
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With