angularJS中form表单提交具体项目代码如下,提交时候出现数据不全也能提交的情况。忘大神帮忙解答


      <script type="text/ng-template " id="myModalContent.html ">
            <form name="merchantForm " class="bs-example form-horizontal form-validation " ng-submit="ok() ">
                <div class="modal-body ">
                    <div class="panel panel-default ">
                        <div class="panel-heading font-bold ">{{title}}</div>
                        <div class="panel-body ">

                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">商户名称</label>
                                <div class="col-lg-9 ">
                                    <input type="text " class="form-control " placeholder="商户名称 " ng-model="merchant.name " required ng-maxlength="32 ">
                                    <!--<span class="help-block m-b-none ">Example block-level help text here.</span>-->
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">商户地址</label>
                                <div class="col-lg-9 ">
                                    <input type="text " class="form-control " placeholder="商户地址 " ng-model="merchant.address " required ng-maxlength="64 ">
                                    <!--<span class="help-block m-b-none ">Example block-level help text here.</span>-->
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">联系人</label>
                                <div class="col-lg-9 ">
                                    <input type="text " class="form-control " placeholder="联系人 " ng-model="user.realName " required ng-maxlength="16 ">
                                    <!--<span class="help-block m-b-none ">Example block-level help text here.</span>-->
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">联系电话</label>
                                <div class="col-lg-9 ">
                                    <input type="phone" class="form-control " placeholder="联系电话 " ng-model="user.phone " required  ng-pattern="/^1[3|4|5|7|8][0-9]\d{8}$/" ng-maxlength="11" popover="请输入您的手机号码。" popover-trigger="focus">
                                    <!--<span class="help-block m-b-none ">Example block-level help text here.</span>-->
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">管理员账号</label>
                                <div class="col-lg-9 ">
                                    <input type="text " class="form-control " placeholder="管理员账号 " ng-model="user.loginName " required ng-maxlength="16" ng-pattern="/^[a-zA-Z]\w{5,15}$/" popover="请输入一个字母开头,6-16字节的登录账号。" popover-trigger="focus">
                                    <!--<span class="help-block m-b-none ">Example block-level help text here.</span>-->
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">管理员密码</label>
                                <div class="col-lg-9 ">
                                    <input type="password" class="form-control " placeholder="管理员密码 " name="password " ng-model="user.password " required ng-maxlength="32" ng-pattern="/^[a-zA-Z]\w{5,15}$/"  popover="请输入一个字母开头,6-16字节的登录密码。">
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-lg-3 control-label ">确认密码</label>
                                <div class="col-lg-9 ">
                                    <input type="password" class="form-control " placeholder="确认密码 " name="confirmPassword " popover="请再次确认您的密码。" popover-trigger="focus" ng-model="user.confirmPassword " required ng-pattern="/^[a-zA-Z]\w{5,15}$/" ng-maxlength="32 " ui-validate=" '$value==user.password' " ui-validate-watch=" 'user.password' ">
                                    <span ng-show='merchantForm.confirmPassword.$error.validator'>确认密码不正确</span>
                                </div>
                            </div>
                            <div class="text-danger wrapper text-center " ng-show="authError ">
                                {{authError}}
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer ">
                    <button type="submit " class="btn btn-primary ">确认</button>
                    <button type="button " class="btn btn-default " ng-click="cancel() ">取消</button>
                </div>
            </form>
        </script>
    </div>

慕虎8944357
浏览 2457回答 1
1回答

__innocence

这个问题很好解决,我是这样解决的:<button type="submit" class="btn btn-primary" ng-disabled="SignUpForm.$invalid">提交</button>SignUpForm是我自己表单的id,你可以换一下这个意思就是:如果存在不合法的验证,按钮就是不可点的状态
打开App,查看更多内容
随时随地看视频慕课网APP