【问题标题】:how to error message on submitting of a from in angular js如何在 Angular js 中提交来自的错误消息
【发布时间】:2016-09-10 22:50:27
【问题描述】:

我想在提交 from 后显示所需的错误消息,但不知道该怎么做,我正在尝试如下所示

<div class="controls">
        <form  name="formx" >
        <ul class="form small">
               <div class="tag">ID</div>
                <input type="text" class="small"  name="enrolmentId" ng-model="enrolmentDetail.Id" required="" onkeypress='return !(event.charCode == 32 )'>
                <div class="error text-danger" style="position: absolute;margin-left: 120px;" ng-show="formx.enrolmentId.$error.required && (formx.$submitted || formx.enrolmentId.$touched)"><p>Id is required</p></div>
            </li>
            <li>
                <div class="btn" ng-click="saveDetails(enrolmentDetail)" ng-show="formAction=='save'">SAVE</div>
            </li>
        </ul>
            </form>
    </div>

现在,一旦我们弄脏了文本框,就会显示错误消息,但是我想在提交表单后显示错误消息,如果有必要的错误,则不应提交

尝试使用 ng-submit 但不知道怎么做

请帮助创建一个小提琴或发布一个例子来做到这一点

【问题讨论】:

    标签: angularjs validation error-handling messages


    【解决方案1】:

    这是example

    html

    <body ng-app="myApp">
    <div ng-controller="myCtrl as mc">
     <form  class="form" name="myForm" ng-submit="mc.submit(myForm)" novalidate>
      <div class="form-group">
       <label for="username">Username</label>
       <input name="username" class="form-control" type="text" ng-model="mc.username" required/>
        <p class="text-danger" ng-show="myForm.username.$error.required && mc.submitted">Username is required</p>
       </div> 
       <div class="form-group">
       <label for="password">Password</label>
       <input name="password" class="form-control" type="password" ng-model="mc.password" required/>
        <p class="text-danger" ng-show="myForm.password.$error.required && mc.submitted">Password is required</p>
       </div> 
       <button class="btn btn-success">submit</button>
    </form>
    <p class="text-success" ng-show="mc.sent && mc.submitted">Form sent</p>
    

    js

    angular.module("myApp",[])
      .controller("myCtrl", function(){
        var vm = this;
        vm.submit = submit;
        function submit(form){
           vm.submitted = true;
           if(form.$valid && vm.submitted === true){
             //Send data logic
             vm.sent = true;
           }
        }
    

    【讨论】:

    • 谢谢你,欧文!这就像魔术一样,又好又简单!希望我可以将此答案标记为已接受!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-11-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多