Question

我已经为角度验证编写了简单的代码。用户输入所有详细信息后，创建按钮应保持禁用状态。但是现在按钮没有被禁用。表单的代码是，

<form name="networkIDForm" novalidate>
  <div class="ActsummaryHdrs pb10">Create Network ID</div>

  <div class="form-group clearfix " ng-class="{ 'has-error': networkIDForm.networkID.$touched && networkIDForm.networkID.$invalid }">
    <input type="text" placeholder="Network ID" name="networkID" class="form-control column48 pull-left " required/>


  </div>

  <div class="clearfix clearfix mt20">

    <div class="column48 pull-left form-group" ng-class="{ 'has-error': networkIDForm.firstname.$touched && networkIDForm.firstname.$invalid}">
      <input type="text" placeholder="First Name" name="firstname" class="form-control" required/>
    </div>
    <div class="column48 pull-left form-group" ng-class="{ 'has-error':  networkIDForm.lastname.$touched && networkIDForm.lastname.$invalid  }">
      <input type="text" placeholder="Last Name" name="lastname" class="form-control" required/>
    </div>
  </div>


  <div class="clearfix mt20 mb10 form-group" ng-class="{'has-error': networkIDForm.email.$touched && networkIDForm.email.$invalid }">

    <input type="text" id="to" name="email" placeholder="Email Address" class="form-control " required/>
  </div>



  <div class="clearfix mt20">

    <div class="column48 pull-left form-group" ng-class="{ 'has-error': networkIDForm.password.$touched && networkIDForm.password.$invalid }">
      <input class="form-control" type="Password" placeholder="Password" name="password" required/>
    </div>
    <div class="column48 pull-right form-group" ng-class="{ 'has-error':networkIDForm.cpassword.$touched && networkIDForm.cpassword.$invalid  }">
      <input type="Password" placeholder="Confirm Password" name="cpassword" class="form-control" required/>
    </div>
  </div>


  <div class="clearfix mt20 mb10">

    <a id="CreateUserCreateBtn" class="btn general_btns_green pull-right ml5" ng-disabled="networkIDForm.$invalid">Create</a>
    <a id="CreateUserBackBtn" onclick="showCreateNetworkID()" class="btn general_btns_grey pull-right mr5" href="">Back</a>

  </div>

</form>

Answer 1

您无法使用disable ng-disabled锚定代码。

尝试使用button代码

<button  id="CreateUserCreateBtn" type="button"  class="btn general_btns_green pull-right ml5"  ng-disabled="networkIDForm.$invalid">Create</button>

或者您可以使用 ng-class

来完成

喜欢这个

.not-active {
   pointer-events: none;
   cursor: default;
}

<a id="CreateUserCreateBtn" class="btn general_btns_green pull-right ml5" ng-class="{'not-active' : networkIDForm.$invalid }">Create</a>

您的表单中也遗漏了ng-model。

的 JSFIDDLE

Angular Js形成验证错误

1 个答案: