简体   繁体   English

Html.ValidationSummary Twitter Bootstrap Modal不起作用

[英]Html.ValidationSummary Twitter Bootstrap Modal not working

this section of code does not work. 此部分代码不起作用。

        @if (ViewData.ModelState.Any(x => x.Value.Errors.Any()))
    {
    <div class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title">Validation Errors</h4>
                </div>
                <div class="modal-body">
                    @Html.ValidationSummary()
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
    }

But this does/ You can't dismiss the alert but it pops up! 但这确实/您无法消除警报,但它会弹出!

@if (ViewData.ModelState.Any(x => x.Value.Errors.Any()))
{
<div class="alert alert-danger">
    <a href="#" class="close" data-dismiss="alert">×</a>
    <h4>Validation Errors</h4>
    @Html.ValidationSummary()
</div>
}

Im using exactly the same validation Razor code each time. 我每次都使用完全相同的验证Razor代码。 & i'm not sure if i should be seeing things happen in the chrome developer toolkit or not. &我不确定我是否应该在chrome开发人员工具包中看到事情发生。

EDIT: Here is the complete page. 编辑:这是完整的页面。

@using Project.Models
@model LoginViewModel
@{
ViewBag.Title = "Log in";
Layout = "";
}

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")

 <!--[if lt IE 9]>
 <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
 <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
 <![endif]-->

</head>
 <body class="login-page">
             @if (ViewData.ModelState.Any(x => x.Value.Errors.Any()))
             {
                <div class="modal fade" id="ValidationSummaryModal">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal"><span     aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                <h4 class="modal-title">Validation Errors</h4>
                            </div>
                            <div class="modal-body">
                                @Html.ValidationSummary()
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-    dismiss="modal">Close</button>
                                <button type="button" class="btn btn-primary">Save     changes</button>
                            </div>
                        </div><!-- /.modal-content -->
                    </div><!-- /.modal-dialog -->
                </div><!-- /.modal -->
    }
    <div class="login-box">
        @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl },     FormMethod.Post, new { role = "form" }))
        {
            @Html.AntiForgeryToken()
            <div class="login-box-title red">
                @ViewBag.Title
            </div>
            <div class="login-box-content">
                @Html.TextBoxFor(m => m.Email, new { @placeholder = "Email" })
                @Html.TextBoxFor(m => m.Password, new { @placeholder = "Password",    @type="password" })
                <input id="submit" name="submit" type="submit" value="Sign in!">
                <div class="half">
                    @Html.ActionLink("Forgot your password?", "ForgotPassword")
                </div>
                <div class="half last">
                    @Html.ActionLink("Sign Up!", "Register")
                </div>
            </div>
        }
    </div>
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/bootstrap")
    <script type="text/javascript">
        $(window).load(function () {
            $('#ValidationSummaryModal').modal('show');
        });
    </script>
 </body>
</html>

Put an id (#ValidationSummaryModal for example) if you have other modals in same view and on page load at a section below scripts add this 如果您在同一视图中还有其他模态,并且在页面加载时在脚本下面的某个部分添加一个id(例如,#ValidationSummaryModal),则添加此ID

<script type="text/javascript">
    $(window).load(function(){
        $('#ValidationSummaryModal').modal('show');
    });
</script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM