2017-05-06 246 views
0

我试图在我的表单上收到错误消息,只要学生姓名不可用。AngularJS:错误消息未得到打印

所以我尝试这个代码

<form name="studentForm" novalidate 
      data-ng-submit="studentForm.$valid && enterStudentRecord()"> 

      <div>Student Name :</div> 
      <input data-ng-model="studentName" required> <span data-ng-show="studentForm.studentName.$touched && studentForm.studentName.$invalid">The name is required.</span><br> 
      <div>Street :</div> 
      <input data-ng-model="street"><br> 
      <div>City :</div> 
      <input data-ng-model="city"><br> 
      <div>State :</div> 
      <input data-ng-model="state"><br> 
      <div>zipcode :</div> 
      <input data-ng-model="zipcode"><br> <br> <br> 
      <button type="submit">Add Student Record</button> 
     </form> 

现在,当我在提交按钮,而不输入学生的名字我没有得到任何errormessage的值点击。

请帮忙!!

回答

0

你应该输入

<input data-ng-model="studentName" name ="studentName" required> 
+0

nopes,不工作 – sparsh610

0
  • 创建名称添加name属性name="studentName"的元素来进行验证。
  • 设置一个变量点击event进入提交按钮并在显示消息时获取该变量。

DEMO

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl', function($scope) { 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <form name="studentForm" novalidate data-ng-submit="studentForm.$valid && enterStudentRecord()"> 
 
      <div>Student Name :</div> 
 
      <input data-ng-model="studentName" name="studentName" required> 
 
      <span data-ng-show="submitted == true && studentForm.studentName.$error.required">The name is required.</span><br> 
 
      <div>Street :</div> 
 
      <input data-ng-model="street"><br> 
 
      <div>City :</div> 
 
      <input data-ng-model="city"><br> 
 
      <div>State :</div> 
 
      <input data-ng-model="state"><br> 
 
      <div>zipcode :</div> 
 
      <input data-ng-model="zipcode"><br> <br> <br> 
 
      <button type="submit" ng-click="submitted = true">Add Student Record</button> 
 
     </form> 
 
</div>