Question

我有一个注册表单，我希望在用户点击提交时进行验证。这就是HTML的样子：

<form ng-submit="RegistrationC.fireReg()" novalidate name="register">
    <div class="row">
        <div class="col-md-6 form-group">
            <input type="text" autocomplete="off" class="form-control" placeholder="First Name" ng-model="RegistrationC.first_name" required name="first_name">
                    <div class="help-block" ng-messages="register.first_name.$error" ng-show="submitted && register.first_name.$error">
                        <p ng-message="required">This field is required.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-6 form-group col-md-offset-3">
            <button type="submit" class="btn btn-success btn-block" ng-click="submitted=true">Register Now</button>
        </div>
    </div>
</form>

如果未输入用户名，则会显示验证消息，但仍会提交。我错过了什么？

编辑1

//init.js - RegistrationController
reg_list.fireReg = function () {
    var url = 'user/register';
    api.makeCall(reg_list, url)
        .then(function (response) {
            reg_list.response = response;
            console.warn(response);
            $location.path('/user/verify');
        })
        .catch(function (errorMessage) {
            console.log("got an error in initial processing", errorMessage);
            event.restoreButton();
        });
};

我知道这个功能存在问题，我会在稍后阶段修复它们。

Answer 1

仅在有效时才提交此表格。 <whatever_form_name>.$valid

<form ng-submit="register.$valid && RegistrationC.fireReg()" novalidate name="register">

Answer 2

在提交表单之前，只需添加检查点表单是否有效

试试这个

<form ng-submit="register.$valid && RegistrationC.fireReg()" novalidate name="register">

Answer 3

如果您要禁用html5（或浏览器）验证程序，则必须删除“必需”＆＃39;您的HTML代码中的属性

http://www.the-art-of-web.com/html/html5-form-validation/

http://www.w3schools.com/tags/att_input_required.asp

提交

3 个答案: