Question

我正在使用razor视图引擎创建一个简单的MVC3应用程序，其中我尝试使用bootstrapvalidator验证我的注册页面，但直到现在还没有成功。我在我的解决方案中包含了bootstarp（v.3.2.0）和bootstrapvalidator（v0.5.1）。

我的观点如下：

1）Index.cshtml

@model test.Models.EmployeeRegister

@{
    ViewBag.Title = "Index";
 }

@Html.Partial("_Register", Model)

2）_Register.cshtml

@model test.Models.EmployeeRegister
@using (Html.BeginForm("Index", "Register", FormMethod.Post, new { @id = "registerForm"}))
{
    <div>
        <h2>Employee Registration</h2>
        <div class="form-group">
            @Html.TextBoxFor(model => model.userId, new { @placeholder = "User Id", @class = "form-control", id="userId" })
            @Html.ValidationMessageFor(model => model.userId)
        </div>
        <div class="form-group">
            @Html.TextBoxFor(model => model.Name, new { @placeholder = "Name", @class = "form-control", id="userName" })
            @Html.ValidationMessageFor(model => model.Name)
        </div>
        <div class="form-group">
            @Html.TextBoxFor(model => model.email, new { @placeholder = "Email", @class = "form-control", id="email" })
            @Html.ValidationMessageFor(model => model.email)
        </div>
        <div class="form-group">
            @Html.TextBoxFor(model => model.address, new { @placeholder = "Address", @class = "form-control", id="address" })
            @Html.ValidationMessageFor(model => model.address)
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" value="Register" class="btn btn-success">Register</button>
            </div>
        </div>
    </div>
}

<script type="text/javascript">
    $(document).ready(function () {
        $('#registerForm').bootstrapValidator({
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                userId: {
                    validators: {
                        notEmpty: 'UserId is required.',
                        stringLength: {
                            min: 3,
                            max: 5,
                            message: 'UserId must be more than 3 and less than 5 characters long.'
                        }
                    }
                },
                userName: {
                    validators: {
                        notEmpty: 'User Name is required.'
                    }
                },
                email: {
                    validators: {
                        notEmpty: 'Email is required.'
                    }
                },
                address: {
                    validators: {
                        notEmpty: 'Address is required.'
                    }
                }
             }
        });
    });
</script>

有两种情况：

1）当“name”属性未添加到提交按钮时，它在下一节中的bootstrapValidator.js中给出了一个错误：

defaultSubmit: function() {
        if (this.$submitButton) {
            // Create hidden input to send the submit buttons
            $('<input/>')
                .attr('type', 'hidden')
                .attr('data-bv-submit-hidden', '')
                .attr('name', this.$submitButton.attr('name'))
                .val(this.$submitButton.val())
                .appendTo(this.$form);
        }

错误是 - 无法读取未定义的属性'val'。

2）当“name”属性（name =“register”）被添加到提交按钮时，它直接进入我的控制器并执行服务器端验证，这显然是我不想要的。

如果我错过了什么，请帮助我。

验证不适用于使用BootstrapValidator的表单

0 个答案: