AngularJs - How do I get my current form in my controller?

Question

I have been following this AngularJS - Server side validation and client side forms SO question, but I can't seem to get it to work.

Given the following code:

<div ng-controller='LoginCtrl'>
    <form id="myForm" onsubmit="return false;" novalidate>
        <input type="text" ng-model="model.userName" />
        <button ng-click="login()">Login</button>
    </form>
</div>

and

app.controller('LoginCtrl', ['$scope', function ($scope) {
    $scope.model = { userName: '' };

    $scope.login = function () {
        console.log($scope.myForm);  // <-- this is undefined
    };
}]);

The console.log shows undefined. I thought that by including the form as a child of the controller div, angular automatically included the form as a variable in my scope.

What am I doing wrong here?

Change your form tag, form name="myform". Angular validation works with form name, not ,id — harishr
– harishr, Commented Jul 23, 2014 at 15:18

harishr · Accepted Answer · 2014-07-23 15:30:55Z

2

change the form tag to

<form name="myForm" onsubmit="return false;" novalidate>

few more points

try not to use id's when working with angular, this will help you get away from jquery
us ng-form, instead of form tag, then you can have child forms, each with its own validation state...

answered Jul 23, 2014 at 15:30

harishr

18.1k9 gold badges84 silver badges131 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJs - How do I get my current form in my controller?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related