0

以下のコードのように、ページ送信時にのみ検証エラーを表示するフォームがあります。この検証は正常に機能しますが、ユーザーが入力フィールドの検証を修正するとすぐに機能します。検証メッセージはすぐに消えます。ユーザーがページを再度送信するまで、この検証メッセージを保持する方法はありますか? 私の要件は、検証メッセージがページの送信時にのみ表示および非表示になることです。

<span id="error" ng-if="addForm.$submitted">
        <div class="ErrorMsgBox">
            <ul>
                <li ng-messages="addForm.startDate.$error">
                    <small id="startDate_req" ng-message="required">Date is mandatory.</small>                      
                </li>                   
            </ul>
        </div>
    </span>

たとえば、ユーザーが日付を指定せずにフォームを送信すると、「日付は必須です」という検証メッセージがユーザーに表示されます。ユーザーが任意の値を入力すると、メッセージが表示されます。ページが再度送信されるまで、この検証メッセージを保持する必要があります。

ng-model-options を試しましたが、ページが送信されるまで入力フィールドの値が保持されません。

ng-model-options="{ updateOn: 'submit' }"

提案してください。

4

1 に答える 1

0

ng-ifメッセージ ディレクティブと組み合わせて、form.$dirtyまたはメッセージ ディレクティブにを追加できform.$submittedます。また、独自のカスタム関数を作成することもできます

ng-if: showErrors()

参照: https://www.sitepoint.com/easy-form-validation-angularjs-ngmessages/

<label>User Message:</label>
<textarea type="text" name="userMessage" ng-model="message" 
          ng-minlength="100" ng-maxlength="1000" required>
</textarea>
<div ng-messages="exampleForm.userMessage.$error" 
     ng-if="exampleForm.userMessage.$dirty">
  <div ng-message="required">This field is required</div>
  <div ng-message="minlength">Message must be over 100 characters</div>
  <div ng-message="maxlength">Message must not exceed 1000 characters</div>
</div>

于 2016-06-05T14:41:19.813 に答える