发表新帖
发表新帖

AngularJS check if form is valid in controller

前端 未结
关注
4 1683
花落未央
花落未央 2020-12-02 11:39

I need to check if a form is valid in a controller.

View:
相关标签:
4条回答
  • 我在风中等你
    2020-12-02 12:14

    I have updated the controller to:

    .controller('BusinessCtrl',
    function ($scope, $http, $location, Business, BusinessService, UserService, Photo) {
        $scope.$watch('createBusinessForm.$valid', function(newVal) {
            //$scope.valid = newVal;
            $scope.informationStatus = true;
        });
        ...
    0 讨论(0)
  • 南旧
    2020-12-02 12:14

    Here is another solution

    Set a hidden scope variable in your html then you can use it from your controller:

    <span style="display:none" >{{ formValid = myForm.$valid}}</span>

    Here is the full working example: 

    angular.module('App', [])
.controller('myController', function($scope) {
  $scope.userType = 'guest';
  $scope.formValid = false;
  console.info('Ctrl init, no form.');
  
  $scope.$watch('myForm', function() {
    console.info('myForm watch');
    console.log($scope.formValid);
  });
  
  $scope.isFormValid = function() {
    //test the new scope variable
    console.log('form valid?: ', $scope.formValid);
  };
});
    <!doctype html>
<html ng-app="App">
<head>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script>
</head>
<body>

<form name="myForm" ng-controller="myController">
  userType: <input name="input" ng-model="userType" required>
  <span class="error" ng-show="myForm.input.$error.required">Required!</span><br>
  <tt>userType = {{userType}}</tt><br>
  <tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br>
  <tt>myForm.input.$error = {{myForm.input.$error}}</tt><br>
  <tt>myForm.$valid = {{myForm.$valid}}</tt><br>
  <tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br>
  
  
  /*-- Hidden Variable formValid to use in your controller --*/
  <span style="display:none" >{{ formValid = myForm.$valid}}</span>
  
  
  <br/>
  <button ng-click="isFormValid()">Check Valid</button>
 </form>
</body>
</html>

    0 讨论(0)
  • 没有蜡笔的小新
    2020-12-02 12:20

    The BusinessCtrl is initialised before the createBusinessForm's FormController. Even if you have the ngController on the form won't work the way you wanted. You can't help this (you can create your ngControllerDirective, and try to trick the priority.) this is how angularjs works.

    See this plnkr for example: http://plnkr.co/edit/WYyu3raWQHkJ7XQzpDtY?p=preview

    0 讨论(0)
  • 梦如初夏
    2020-12-02 12:27

    Try this

    in view:

    <form name="formName" ng-submit="submitForm(formName)">
 <!-- fields -->
</form>

    in controller:

    $scope.submitForm = function(form){
  if(form.$valid) {
   // Code here if valid
  }
};

    or

    in view:

    <form name="formName" ng-submit="submitForm(formName.$valid)">
  <!-- fields -->
</form>

    in controller:

    $scope.submitForm = function(formValid){
  if(formValid) {
    // Code here if valid
  }
};
    0 讨论(0)
 看不清?
提交回复
热议问题