Question

嗨，我是angularjs的新手。我正在尝试对所需字段进行简单验证，如下所示。

{{1}}

当我点击提交时，我的验证无效。如果我单击文本框并单击外部验证正在运行。我可以在这里得到一些帮助解决这个问题吗？任何帮助，将不胜感激。谢谢。

Answer 1

我还会在表单中添加novalidate属性，如下所示：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body ng-app="app">
  <div ng-controller="ctrl">

    <form novalidate name="form" ng-submit="submit()">
       <div class="inputblock">
      <span class="input-icon"><img src="images/office-icon.png"></span>
      <input type="text" class="with-icon" placeholder="Work MainStreet" ng-model="workmainstreet" required="" name="workmainstreet">
      <span ng-show="form.$submitted || form.workmainstreet.$touched" class="error-message">
      <span style="color:red" ng-show="form.workmainstreet.$error.required">Please Enter Work MainStreet</span>
      </span>
      </div>
      <div class="inputblock">
      <span class="input-icon"><img src="images/office-icon.png"></span>
      <input type="text" class="with-icon" placeholder="Work SubStreet" ng-model="worksubstreet" required="" name="worksubstreet">
      <span ng-show="form.$submitted || form.worksubstreet.$touched" class="error-message">
      <span style="color:red" ng-show="form.worksubstreet.$error.required">Please Enter Work SubStreet</span>
      </span>
      </div>
       <div class="button-container">

      <input type="submit" ng-disabled="form.worksubstreet.$dirty && form.worksubstreet.$invalid || form.workmainstreet.$dirty && form.workmainstreet.$invalid" value="Submit" id="input-submit"/>
      </div>
    </form>
  </div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>

</body>
</html>

否则浏览器接管。
和代码一起使用：

angular.module('app', [])
.controller('ctrl', function($scope){

  $scope.submit =function(){
    $scope.RegisterUser();
  }
})

Angularjs验证无法处理提交按钮

1 个答案: