Form validation in angularjs doesn't work

Question

I wrote a form validation in angularjs but it does not work.

When I send form with empty fields form has class 'ng-valid' and 'ng-hide' doesn't remove from error.

<form name="form" ng-submit="createUser(user)" novalidate>
    <div class="form-group">
        <label for="name">Nazwa użytkownika:</label>
        <input type="text" name="name" id="name" class="form-control" ng.model="user.name" required="">
        <div ng-show="form.$submitted || form.name.$touched">
            <div ng-show="form.name.$error.required">Podaj nazwę użytkownika.</div>
        </div>
    </div>
    <div class="form-group">
        <label for="email">Adres e-mail:</label>
        <input type="email" name="email" id="email" class="form-control" ng.model="user.email">
        <div ng-show="form.$submitted || form.email.$touched">
            <span ng-show="form.email.$error.required">Podaj adres e-mail.</span>
            <span ng-show="form.email.$error.email">Adres e-mail jest nieprawidłowy.</span>
       </div>
    </div>
    <div class="form-group">
        <label for="role">Rola użytkownika:</label>
        <select name="role" id="role" class="form-control" ng-model="user.role">
            <option value="3">klient</option>
            <option value="2">pracownik</option>
            <option value="3">admin</option>
        </select>
        <div ng-show="form.$submitted || form.role.$touched">
            <span ng-show="form.role.$error.required">Wybierz rolę użytkownika.</span>
        </div>
    </div>
    <button type="submit" class="btn btn-primary">Dodaj użytkownika</button
</form>

Vivz · Accepted Answer · 2017-08-28 09:55:06Z

3

You have a typo in some of your ng-model. It should be ng-model instead of ng.model. You have to set ng-required="true" or you can simply put required across all your mandatory fields

<input type="text" name="name" id="name" class="form-control" ng-model="user.name" ng-required="true">

edited Aug 28, 2017 at 9:55

answered Aug 28, 2017 at 9:49

Vivz

6,6282 gold badges19 silver badges34 bronze badges

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

3 Comments

abhig10 Over a year ago

ng-model not ng.model

abhig10 Over a year ago

And required="" does not make a difference. required="" or ng-required="true" or required works just fine.

Vivz Over a year ago

Yes I know but the OP hasn't put required="" across all mandatory fields

Collectives™ on Stack Overflow

Form validation in angularjs doesn't work

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related