angularjsng-show

ng-show doesn't work in form


I create form and use AngularJs. I need display errors and I have a problem. My expression for ng-show doesn't work.

My code:

<form name="createProductForm" ng-submit="createProduct(product)" novalidate>

    <input type="text" ng-model="product.name" ng-minlength="3" required> <br>
    <p ng-show="createProductForm.product.name.$error.required && createProductForm.product.name.$dirty">Nazwa produktu jest wymagana.</p>
    <p ng-show="createProductForm.product.name.$error.minlength && createProductForm.product.name.$dirty">Nazwa produktu jest zbyt krótka.</p>

    <button type="submit" ng-disabled="createProductForm.$invalid">Dodaj produkt</button>

</form>

Solution

  • Your input tag MUST have a name attribute. ngModel does not provide validation states.

    <input name="nameAttributeHere"/>
    
    <p ng-show="createProductForm.nameAttributeHere.$error.required && createProductForm.nameAttributeHere.$dirty">...</p>
    

    ngModel and form validation states are completely separate directives.