Javascript 防止angularJS/ionic中隐藏字段的验证
我有这个表单,当满足某些要求时,我使用ng hide来隐藏一些字段。我已经对所有字段使用了验证(当一个字段保持为空时,它将验证并要求填充该字段)。问题是当我的字段被隐藏时,它似乎仍然在验证。所以我不能继续我的表格。我怎样才能解决这个问题 我对隐藏的字段使用了ng required,并在不需要该字段时将其设置为false,但它似乎不起作用 这是我所指表格的一部分:Javascript 防止angularJS/ionic中隐藏字段的验证,javascript,angularjs,forms,validation,ionic-framework,Javascript,Angularjs,Forms,Validation,Ionic Framework,我有这个表单,当满足某些要求时,我使用ng hide来隐藏一些字段。我已经对所有字段使用了验证(当一个字段保持为空时,它将验证并要求填充该字段)。问题是当我的字段被隐藏时,它似乎仍然在验证。所以我不能继续我的表格。我怎样才能解决这个问题 我对隐藏的字段使用了ng required,并在不需要该字段时将其设置为false,但它似乎不起作用 这是我所指表格的一部分: <div class="form-group" ng-class="{ 'has-error' :submitted &
<div class="form-group" ng-class="{ 'has-error' :submitted && (myForm.scheduler.$pristine || myForm.scheduler.$invalid)}">
<label class="labelColor"><h5><b>Payment Type *</b></h5></label>
<select type="select" class="textbox-n" id="scheduler" ng-model="data.scheduler" ng-change="scheduleChange()" ng-options="Scheduler.name for Scheduler in SchedulersArr" name="scheduler" required>
<option id="default" value="" selected="selected">--Select--</option></select>
<span class="help-inline" ng-show="submitted && (myForm.scheduler.$pristine || myForm.scheduler.$invalid)" >A Payment Type is required.</span>
</div>
<!-- Effective Date:-->
<div ng-hide = "hideFutureDate">
<div class="form-group" ng-class="{ 'has-error' : myForm.effectiveDate.$invalid && myForm.effectiveDate.$dirty && submitted || (myForm.effectiveDate.$invalid && myForm.effectiveDate.$pristine) && submitted }">
<label class="labelColor" ><h5><b>Effective Date*</b></h5></label><br>
<input style="width:100%" class="item-input-wrapper" type="date" id="effectiveDate" name="effectiveDate" ng-model="data.effectiveDate"
placeholder="Effective Date" ng-required="!hideFutureDate" />
<span class="help-inline" ng-show="submitted && myForm.startDate.$error.required" >A Effective date is required.</span>
<font color="red" >{{dateValidation}}</font>
</div>
</div>
<!--From/To Dates -->
<div ng-hide = "hideRecurrent" >
<div class="row" style="padding-left:15px">
<div class="form-group" ng-class="{ 'has-error' : myForm.startDate.$invalid && myForm.startDate.$dirty && submitted || (myForm.startDate.$invalid && myForm.startDate.$pristine) && submitted }">
<label class="labelColor" ><h5><b>From Date*</b></h5></label><br>
<input style="width:100%" class="item-input-wrapper" type="date" id="startDate" name="startDate" ng-model="data.startDate"
placeholder="From Date" ng-required="!hideRecurrent" />
<span class="help-inline" ng-show="submitted && myForm.startDate.$error.required" >A Start date is required.</span>
<font color="red" >{{dateValidation}}</font>
</div>
<div class="form-group" ng-class="{ 'has-error' : myForm.toDate.$invalid && myForm.toDate.$dirty && submitted || (myForm.toDate.$invalid && myForm.toDate.$pristine) && submitted }">
<label class="labelColor" ><h5><b>To Date*</b></h5></label><br>
<input style="width:100%" class="item-input-wrapper" type="date" id="toDate" name="toDate" ng-model="data.toDate"
placeholder="To Date" ng-required="!hideRecurrent" />
<span class="help-inline" ng-show="submitted && myForm.toDate.$error.required" >An End date is required.</span>
<font color="red" >{{dateValidation}}</font>
</div>
</div>
我知道我可以使用ng if来解决这个问题,但不确定如何解决。您确实可以使用
ng if来解决这个问题。假设您的后端实际上可以处理诸如data.startDate
之类的空白输入,那么您可以执行以下操作:
<input ... ng-if="!hideRecurrent" />
当不满足条件时,ng if
实际上会将其从页面中删除,而不是显示/隐藏输入。页面上没有输入意味着没有验证错误。您确实可以使用ng if
来解决此问题。假设您的后端实际上可以处理诸如data.startDate
之类的空白输入,那么您可以执行以下操作:
<input ... ng-if="!hideRecurrent" />
当不满足条件时,ng if
实际上会将其从页面中删除,而不是显示/隐藏输入。页面上没有输入意味着没有验证错误。一旦它删除,当条件不满足时我可以取回它吗?一旦它删除,当条件不满足时我可以取回它吗?