CODEWITHSUNDEEP
javascriptangularjsvalidationng-messages
Jahongir Rahmonov
Jahongir Rahmonov

Reputation: 13723

Form is not validated in AngularJS

I have this simple form:

<form name="assignCtrl.carrierForm">
     <md-input-container class="md-block">
            <label>Company Name</label>
            <input required name="carrierName" ng-model="assignCtrl.searchKeyword">
            <div ng-messages="assignCtrl.carrierForm.carrierName.$error">
                <div ng-message="required">This field is required.</div>
            </div>
     </md-input-container>

    <md-input-container class="md-block">
        <label>Company Email</label>
        <input type="email" name="carrierEmail" ng-model="assignCtrl.companyEmail" required
                               ng-pattern="/^.+@.+\..+$/" minlength="5" maxlength="100"/>
        <div ng-messages="assignCtrl.carrierForm.carrierEmail.$error">
             <div ng-message="required">Email is required.</div>
             <div ng-message-exp="['pattern', 'minlength', 'maxlength']">Please enter a valid email
                                address.
             </div>
        </div>
     </md-input-container>

    <md-button type="submit" ng-disabled="assignCtrl.carrierForm.$invalid" ng-click="assignCtrl.createAndAssign()">Create and Assign
    </md-button>

</form>

It is not being validated! ng-messages do not appear at all.

form.$error is also empty:

{{assignCtrl.carrierForm.$error | json }}

What could be the reason?

Upvotes: 1

Views: 64

Answers (1)

Jahongir Rahmonov
Jahongir Rahmonov

Reputation: 13723

So, I found my mistake! In my huge html file, the form in the question turned out to be inside another form by mistake! That's why, the inner form was being removed! So, I removed the outer form and everything is just fine!

Upvotes: 1

Related Questions