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

Question

      <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>

Answer 1

这个问题很好解决，我是这样解决的：

<button type="submit" class="btn btn-primary" ng-disabled="SignUpForm.$invalid">提交</button>

SignUpForm是我自己表单的id,你可以换一下

这个意思就是：如果存在不合法的验证，按钮就是不可点的状态