Question

我的表单验证无法点击提交按钮。我已经在HTMl中正确添加了控制器。任何领导都将不胜感激。谢谢提前：）

 <form id="formbody"  ng-submit="submit(user)" name="form" novalidate="">

    <div class="formtext" >

    <div class="has-header">
      <ion-label class="labelstyle" > Select Service  </ion-label>
      <input  ng-click="goToPage()" name="selectsrve" type="text" class="formtext1 inputimg"  ng-model="user.firstname" placeholder=" Select from list" required="">
      <!-- <img   src="img/icon-arrow-gray.png"></img> -->
      </input>
      <span ng-show="user.firstname.$dirty && users.firstname.$error.required">Please select the Service</span>
    </div>
     <div style="padding-left: 275px;">
      <button type="submit">Submit</button>
     <!--  <div  type="button" id="btn" style="color: red;" >Submit</div> -->
    </div>
    </div>
        </form>


.controller('ExampleController',function($scope,$location,$scope, $stateParams){
     $scope.singleSelect='';

     $scope.goToPage=function(){
        console.log("selectservice");
        $location.path("/selectservice");
     }

     $scope.submit = function(){
    // Set the 'submitted' flag to true
    alert("In the submit button");
    $scope.submit=function(user){
        alert("user"+user.firstName);
    };

  }

    })

Answer 1

您的$scope.submit功能应该是这样的。删除其中的其他$scope.submit函数。为什么你的输入中有ng-click？并在您单击输入时重定向

$scope.submit = function(user){

     alert("user"+user.firstName);
}

Answer 2

我对您的代码进行了一些更改

在您的范围内

而不是user.firstname.$dirty && users.firstname.$error.required，您应该使用表单名称和输入字段名称form.$submitted && form.selectsrve.$invalid && form.selectsrve.$error.required

您也可以使用ng-submit中的条件仅在有效时才提交表单ng-submit="form.$valid && submit(form)"

并在您的控制器中使用范围变量来获取用户

$scope.submit=function(){
        alert("user "+$scope.user.firstname);
    };

请查看此plunker

Angular JS表单验证不起作用

2 个答案: