在提交时忽略必填字段验证

时间:2016-11-28 06:46:20

标签: javascript angularjs

我正在使用ng-message进行验证。当我点击忘记PIN其验证两个字段但我只想要帐号字段。但是当我点击“登录回收并重新启动”时,它应该验证两者。

我的表格就像这样

 <form class="row" ng-if="!$ctrl.paybackLoggedin" name="paybackForm" novalidate>
    <div class="col-sm-8 col-md-5">
        <div class="form-group" ng-class='{ "has-success" : paybackForm.paybackalias.$valid, "has-error": paybackForm.paybackalias.$invalid && (paybackForm.$submitted || paybackForm.paybackalias.$dirty), "is-empty": !paybackForm.paybackalias.$viewValue }'>
            <input class="form-control" name="paybackalias" pattern="\d{10}|\d{16}" ng-model="$ctrl.paybackAlias" placeholder="Mobile Number / Payback Card Number" type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-minlength="10" ng-maxlength="16" required>
            <div ng-show="paybackForm.paybackalias.$invalid && !paybackForm.paybackalias.$pristine" ng-messages="paybackForm.paybackalias.$error" class="help-block">
                <span ng-message="required">This field is required</span>
                <span ng-message="maxlength || minlength">Enter a valid Phone number or Payback account</span>
            </div>
        </div>
    </div>
    <div class="col-sm-4 col-md-2">
        <div class="form-group" ng-class='{ "has-success" : paybackForm.paybackpin.$valid, "has-error": paybackForm.paybackpin.$invalid && (paybackForm.$submitted || paybackForm.paybackpin.$dirty), "is-empty": !paybackForm.paybackpin.$viewValue }'>
            <input class="form-control" name="paybackpin" ng-model="$ctrl.paybackPin" placeholder="Payback PIN" type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-minlength="4" ng-maxlength="4" required>
            <div ng-show="paybackForm.paybackpin.$invalid && !paybackForm.paybackpin.$pristine" ng-messages="paybackForm.paybackpin.$error" class="help-block">
                <span ng-message="required">This field is required</span>
                <span ng-message="maxlength || minlength">Enter a valid PIN number</span>
            </div>
            <small class="help-block text-right"><button class="btn-link-default" ng-click="paybackForm.paybackalias.$valid && $ctrl.paybackForgotPass()">Forgot PIN</button></small>
        </div>
    </div>
    <div class="col-md-5">
        <div class="form-group">
            <button class="btn btn-block btn-default" ng-click="paybackForm.$valid && $ctrl.paybackLogin()">LOGIN TO PAYBACK AND REDEEM</button>
        </div>
    </div>
</form>

1 个答案:

答案 0 :(得分:0)

由于您在html上使用客户端验证,因此您无法选择要验证的内容,在您的情况下,我建议您在提交时对其进行验证。\ n功能,例如,