使用 ng-class 验证无效

Question

在我的应用程序中，直到填写所有必填字段后，才会启用更新计费按钮。在这里，我使用 ng-class 进行验证。但是，在我填写必填字段之前，按钮不会保持禁用状态，而是将错误消息显示为 "message webpage: [object] [Object]" 有帮助吗？

  @if (HttpContext.Current.Session["RoleID"].ToString() == "3")
                                                {
                                                    <div class="form-horizontal">
                                                        <div class="form-group">
                                                            <label class="control-label col-lg-2 pull-left">Quality<span class="Imp">*</span></label>
                                                            <div class="col-lg-8">

                                                                <select id="Quality" disabled="disabled" name="Quality" class="form-control" style="width:170px" tooltip="Quality is required"
                                                                        tooltip-placement="top" tooltip-trigger="mouseenter">
                                                                    <option value="default">Choose here</option>
                                                                    <option value="Satisfactory">Satisfactory</option>
                                                                    <option value="NotSatisfactory">Not Satisfactory</option>
                                                                </select>
                                                            </div>
                                                        </div>
                                                    </div>
                                                }

                                                else
                                                {
                                                    <div class="form-horizontal" ng-class="{'has-error':EditOCBForm.Quality.$invalid &&
                                                  EditOCBForm.Cycle.$dirty}">
                                                        <div class="form-group">
                                                            <label class="control-label col-lg-2 pull-left">Quality<span class="Imp">*</span></label>
                                                            <div class="col-lg-8">
                                                                <select id="Quality" name="Quality" class="form-control" style="width:170px" ng-model="vm.EditRef_OCBUI.Quality" tooltip="Quality is required"
                                                                        tooltip-placement="top" tooltip-trigger="mouseenter" required="required">
                                                                    <option value="Satisfactory">Satisfactory</option>
                                                                    <option value="NotSatisfactory">Not Satisfactory</option>
                                                                </select>
                                                            </div>
                                                        </div>
                                                    </div>
                                                }

按钮代码：

<button type="button" class="btn btn-primary" data-dismiss="modal" data-ng-click="Edit()" ng-disabled="EditOCBForm.$invalid" id="ticketEditbtn">Update Billing</button>

Answer 1

为什么不用表格？

<form name="myForm">
  <input name="name" type="text" id="name" class="form-control" ng-model="vm.list.name" required>

  <div class="alert alert-danger ng-if="!formName.name.$valid">
    <p>The field is required</p>            
  </div>

  <button type="submit" ng-disabled="!formName.$valid">Save</button>
</form>

Answer 2

您在第一个输入

中遗漏了 required 标签

 <select id="Quality" disabled="disabled" name="Quality" class="form-control" 
     style="width:170px" tooltip="Quality is required" tooltip-placement="top" tooltip-trigger="mouseenter" required >

       <option value="default">Choose here</option>
       <option value="Satisfactory">Satisfactory</option>
      <option value="NotSatisfactory">Not Satisfactory</option>

</select>

使用 ng-class 验证无效

validation using ng-class not working

html

angularjs

ng-class