StevieB StevieB - 1 year ago 116
AngularJS Question

Angular Validation NG-message dont show required after submit and erase text

This is my current validation set up for my form

<ng-messages for="searchForm.$error" ng-if="searchForm.$submitted">
<ng-message when="required" class="error-message">This search field is required.</ng-message>
</ng-messages>


and my form

<form role="form" ng-submit="searchForm.$valid && searchcode()" name="searchForm" novalidate>


It works fine.

But here is what I don't like this scenario

1) Hit Enter on empty searchbox - > it shows the correct message "Field Is Required"

2) Start Typing and Erase Text without hitting enter - > it shows error message again

It's the second scenario I dont want...any ideas ?

Answer Source

Maybe your field name for the error message is not right. Cannot tell the exact reason why yours not work because you did not provide an example. However, when I tested, it works fine.

 <form ng-controller="MyCtrl" role="form" name="searchForm" novalidate
    ng-submit="searchcode()">
    <input type="text" ng-model="field" name="myField" 
      ng-keypress="searchForm.$submitted=false"
      required minlength="5" />
    <ng-messages ng-if="searchForm.$submitted"
      for="searchForm.myField.$error">
      <ng-message when="required" class="error-message">
        This search field is required.
      </ng-message>
    </ng-messages>
  </form>

http://plnkr.co/edit/56koY7YxPDVFe4S26x9N?p=preview