关闭模式时如何清除 ValidationSummary？答案

【问题标题】：How do i clear ValidationSummary when i close my modal?关闭模式时如何清除 ValidationSummary？
【发布时间】：2015-10-16 01:00:17
【问题描述】：

我有以下表格，这是一个引导表格。当发生验证错误时，我得到了很好的验证摘要。但是当我关闭模式时，我想清除摘要。我该怎么做？。

@using (Html.BeginForm("Index", "Home", null, FormMethod.Post, new { Id = "frmSendEmail", @class = "form-horizontal" }))
{
    <div class="modal fade" id="modalSendEmail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="modalLabel">Email</h4>
                </div>
                <div class="modal-body">
                    @Html.ValidationSummary(false, "Oops! Seems like we are missing the following details:", new { @class = "alert alert-danger" })
                    <div class="form-group">
                        <label for="txtName" class="col-sm-2 control-label">* Name:</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(model => model.SenderName, null, new {id = "txtName", @class = "form-control", placeholder = "Name"})
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="txtEmail" class="col-sm-2 control-label">* Email:</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(model => model.SenderEmail, null, new { id = "txtEmail", @class = "form-control", placeholder = "Email", type = "email" })
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="txtTelephone" class="col-sm-2 control-label">Telephone:</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(model => model.SenderTelephone, null, new { id = "txtTelephone", @class = "form-control", placeholder = "Telephone" })
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="txtEnquiry" class="col-sm-2 control-label">* Enquiry:</label>
                        <div class="col-sm-10">
                            @Html.TextAreaFor(model => model.SenderEnquiry, new { id = "txtEnquiry", @class = "form-control", rows = "5" })
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" id="btnCloseSendEmail">Close</button>
                    <button type="submit" class="btn btn-warning" id="btnSendEmail">Send</button>
                </div>
            </div>
        </div>
    </div>
}

【问题讨论】：

标签： jquery twitter-bootstrap validation validationsummary

【解决方案1】：

使用hidden.bs.modal 事件检测模态关闭。而这个validation-summary-errors 是为验证错误div 添加的类。因此您可以根据需要将其删除、清空或隐藏。

$('#modalSendEmail').on('hidden.bs.modal', function (e) {      
    $('.validation-summary-errors').remove() 
    //or 
    //$('.validation-summary-errors').empty() 
    //or 
    //$('.validation-summary-errors').hide()
})

【讨论】：

$('#modalSendEmail').on('hidden.bs.modal', function (e) { $('.field-validation-error').html(""); } ) 这对我有用