Question

我正在使用formValidation来验证Bootstrap ASP.NET应用中的MVC表单。我使用过此插件，因为它被称为bootstrapValidator并且从未遇到过困难。现在我正试图驯服0.6.2版本，并且不能让它设置字段来验证。

我在页面底部有以下脚本：

<script src="/Scripts/jquery-1.11.2.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.form.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/formValidation/formValidation.js"></script>

下面我放置了我的模态：

<div aria-hidden="true" aria-labelledby="modalBox_label" role="dialog" tabindex="-1" id="modalBox" class="modal fade"></div>

我有局部视图来填充我的模态用户的动作。我认为最重要的部分是形式：

@using (Html.BeginForm("SomeAction", "SomeController", new { area = "SomeArea", divModal = divModal, divTarget = divTarget }, FormMethod.Post, new
{
    id = modalForm,
    @role = "form",
    @class = "form",
    @data_divTarget = "#" + divTarget
}))
{
    @Html.AntiForgeryToken()
    @Html.HiddenFor(m => m.Id)
    <div class="modal-body form-horizontal">
        <div class="form-group">
            @Html.LabelFor(m => m.Name, new { @class = "control-label col-sm-3" })
            <div class="col-sm-5">
                @Html.TextBoxFor(m => m.Name, new { @data_fv_notempty_message="You must enter name", @data_fv_notempty="True", @class="form-control", placeholder="Enter name" })
            </div>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <input type="submit" value="Submit form" class="btn btn-primary" />
    </div>
}

加载部分视图时，生成的代码如下所示：

<div aria-hidden="false" aria-labelledby="modalBox_label" role="dialog" tabindex="-1" id="modalBox" class="modal fade in" style="display: block;">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button data-dismiss="modal" class="close" type="button" id="modalBox_btnClose"><span aria-hidden="true">×</span><span class="sr-only">Закрыть</span></button>
            <h4 id="modalBox_label" class="modal-title">Some title</h4>
        </div>
        <form role="form" method="post" id="modalBox_form" data-divtarget="#divTarget" class="form fv-form fv-form-bootstrap" action="/SomeController/SomeAction" novalidate="novalidate">
            <button type="submit" class="fv-hidden-submit" style="display: none; width: 0px; height: 0px;"></button>
            <input type="hidden" value="someToken" name="__RequestVerificationToken">
            <input type="hidden" value="0" name="Id" id="Id">
            <div class="modal-body form-horizontal">
                <div class="form-group">
                    <label for="Name" class="control-label col-sm-3">Name</label>
                    <div class="col-sm-5">
                        <input type="text" value="" placeholder="Enter name" name="Name" id="Name" data-fv-notempty-message="You must enter name" data-fv-notempty="True" class="form-control">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">Close</button>
                <input type="submit" class="btn btn-primary" value="Submit form">
            </div>
        </form>
    </div>
    <div style="display: none; width: 0px; height: 0px;">
        <script>
            $(document).ready(function () {
                validateModalForm('#modalBox_form');
            });
        </script>
    </div>
</div>
</div>

哦，我的表格下面的小脚本！它用于调用formValidation插件，代码在这里：

function validateModalForm(formId) {
    $(formId).formValidation({
        framework: 'bootstrap',
        icon: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        }
    }).on('success.form.fv', function (e) {
        alert('Keep calm and do submit');
    });
}

当我点击提交按钮时，它会返回警告消息然后提交。我无法发现问题。救命！：（

Answer 1

好的，问题在于：data-fv-notempty="True" 该值应以小写形式写出：data-fv-notempty="true"

FormValidation插件不验证表单

1 个答案: