angularJS顯示消息

here is the angular code. 
 

 
.controller("myStuList", ['$scope', "weejoinMessage", "httpServer", "$modal", "ngWeeJoinServer", "stuServer", function ($scope, weejoinMessage, httpServer, $modal, server, stuServer) { 
 
    
 
     //第一次進入是加載所有學員數據 
 
     $scope.stuinfos = infos.info; // i give the data form info.info to stuinfos. 
 

 
     // 
 
     $scope.course = ''; 
 
     $scope.class = ''; 
 
     $scope.name = ''; 
 
     $scope.age = ''; 
 
     $scope.scores = ''; 
 

 
     $scope.createNew = function() { 
 
      httpServer.httpHandle({ 
 
       url: stuBag.action.createNew, 
 
       data: { 
 
        courseId: $scope.course, 
 
        classId:$scope.class, 
 
        stuname: $scope.name, 
 
        age: $scope.age, 
 
        scores: $scope.scores 
 
       }, 
 
       success: function (data) { 
 
        weejoinMessage.messageSuccess("添加成功！");     
 
        $scope.stuinfos.push({ 'CourseName': $scope.course, 'ClassName': $scope.class, 'StuName': $scope.name, 'Age': $scope.age, 'Scores': $scope.scores });     
 
       } 
 
      }); 
 
      
 
     };

請幫忙看看這個問題的驗證。當打開創建頁面時，所有驗證消息都顯示爲收集。查看html代碼。我想在點擊輸入文本時顯示驗證消息。並且當輸入消息根據驗證錯誤時。並在輸入texbox下面顯示消息。

<div ng-app="stu.info" ng-controller="myStuList"> 
 
    <form name="createnew_form" class="form-horizontal" role="form" ng-submit="createNew()" novalidate> 
 

 

 
     <div class="form-group"> 
 
      <label for="stuname" class="col-md-2 control-label">姓名</label> 
 
      <div class="col-md-4"> 
 
       <input type="text" class="form-control" placeholder="姓名" name="stuname" ng-model="name" ng-minlength=3 ng-maxlength=20 required /> 
 
       <div class="error" ng-show="createnew_form.stuname.$dirty && createnew_form.stuname.$invalid"> 
 
        <small class="error" ng-show="createnew_form.stuname.$error.required"> 
 
         請輸入姓名 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.stuname.$error.minlength"> 
 
         至少輸入兩個字 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.stuname.$error.maxlength"> 
 
         最多輸入五個字 
 
        </small> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <div class="form-group"> 
 
      <label class="col-md-2 control-label">年齡</label> 
 
      <div class="col-md-4"> 
 
       <input type="number" min="0" max="100" required class="form-control" name="age" 
 
         ng-model="age" /> 
 
       <div class="error-container" ng-show="createnew_form.age.$dirty && createnew_form.age.$invalid">      
 
        <small class="error" ng-show="createnew_form.age.$error.required"> 
 
         請輸入年齡 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.age.$error.min"> 
 
         最小年齡爲0 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.age.$error.max"> 
 
         最大年齡爲100 
 
        </small> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     
 
     <div class="form-group"> 
 
      <div style="padding-left:110px"> 
 
       <input type="submit" value="確認添加" class="btn btn-primary" /> 
 
      </div> 
 
     </div> 
 
    </form> 
 
</div>

來源

2014-10-30 ray

任何控制檯錯誤？ – 2014-10-30 04:57:37

請檢查angularjs code.and幫我找到問題 – ray 2014-10-30 04:59:51

我在jsFiddle上使用過你的代碼，表單驗證按預期工作。我沒有像前面提到的那樣看到所有的錯誤信息。請在這裏看到的小提琴：http://jsfiddle.net/giri_jeedigunta/4508cd4r/

你的HTML代碼：

<div ng-app="stu.info" ng-controller="myStuList"> 
 
    <form name="createnew_form" class="form-horizontal" role="form" ng-submit="createNew()" novalidate> 
 

 

 
     <div class="form-group"> 
 
      <label for="stuname" class="col-md-2 control-label">姓名</label> 
 
      <div class="col-md-4"> 
 
       <input type="text" class="form-control" placeholder="姓名" name="stuname" ng-model="name" ng-minlength=3 ng-maxlength=20 required /> 
 
       <div class="error" ng-show="createnew_form.stuname.$dirty && createnew_form.stuname.$invalid"> 
 
        <small class="error" ng-show="createnew_form.stuname.$error.required"> 
 
         請輸入姓名 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.stuname.$error.minlength"> 
 
         至少輸入兩個字 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.stuname.$error.maxlength"> 
 
         最多輸入五個字 
 
        </small> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <div class="form-group"> 
 
      <label class="col-md-2 control-label">年齡</label> 
 
      <div class="col-md-4"> 
 
       <input type="number" min="0" max="100" required class="form-control" name="age" 
 
         ng-model="age" /> 
 
       <div class="error-container" ng-show="createnew_form.age.$dirty && createnew_form.age.$invalid">      
 
        <small class="error" ng-show="createnew_form.age.$error.required"> 
 
         請輸入年齡 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.age.$error.min"> 
 
         最小年齡爲0 
 
        </small> 
 
        <small class="error" ng-show="createnew_form.age.$error.max"> 
 
         最大年齡爲100 
 
        </small> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     
 
     <div class="form-group"> 
 
      <div style="padding-left:110px"> 
 
       <input type="submit" value="確認添加" class="btn btn-primary" /> 
 
      </div> 
 
     </div> 
 
    </form> 
 
</div>

來源

2014-10-30 06:24:39

不宜creatnew_form.course.$invalid是createnew_form.course.$invalid（在「createnew」一個 'e'）？

來源

2014-10-30 05:03:51

是的。但是當我改變這個。它將在視圖頁面上顯示所有錯誤消息 – ray 2014-10-30 05:36:33

angularJS顯示消息

回答

相關問題