模型验证在jQuery对话框中不起作用

Question

我正在使用MVC3并添加了具有所需属性的模型验证。然后我创建了具有jQuery对话框的页面（不是Ajax对话框）。在这种情况下，验证不起作用。但是，如果我把对话框中的HTML页面，它工作正常。

有没有人知道如何解决问题？

这里是我的JavaScript：

$(document).ready(function() { 
    $("#registerDialog").dialog({ autoOpen: false, show: "blind", hide: "explode", modal: true, resizable: false, height: 570, width: 390 }); 

    $(".headerButton").button(); 
    $(".accountBtn").button(); 
    $('ul').roundabout({ autoplay: 'false', autoplayDuration: 3000 }); 

    $("#registerBtn").click(function() { 
    $("#registerDialog").dialog("open"); return false; }); 
    $("#closeRegisterDialog").click(function() { $("#registerDialog").dialog("close"); 
    }); 

    $("#registerBtnSbmt").click(function() { 
    $("#registerForm").submit(); return false; }); 
    }) 



@using (Html.BeginForm("Register", "Account", FormMethod.Post, new { id = "registerForm" })) 
{  

    <div id="registerDialog" title="Регистрация"> 
     @Html.LabelFor(x => x.FirstName) 
     <br/> 
     @Html.TextBoxFor(x => x.FirstName, new { @class = "registerUser" }) 
     <br/> 
     @Html.ValidationMessageFor(x => x.FirstName)   
     <br/> 
     @Html.LabelFor(x => x.LastName)   
     <br/> 
     @Html.TextBoxFor(x => x.LastName, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.LastName)   
     <br/> 
     @Html.LabelFor(x => x.Email)   
     <br/> 
     @Html.TextBoxFor(x => x.Email, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Email)   
     <br/> 
     @Html.LabelFor(x => x.Password)   
     <br/> 
     @Html.TextBoxFor(x => x.Password, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Password)   
     <br/> 
     @Html.LabelFor(x => x.ConfirmPassword)   
     <br/> 
     @Html.TextBoxFor(x => x.ConfirmPassword, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.ConfirmPassword)         
     <br/> 
     @Html.CheckBoxFor(x => x.RememberYou) запомнить Вас?       
     <br/> 
     <br/> 
     @Html.ActionLink("Сохранить", "LogIn", "Account", null, new { @class = "accountBtn", style = "font-size: 0.8em;", id = "registerBtnSbmt" }) 
     <a href="#" class="accountBtn" id="closeRegisterDialog" style = "font-size: 0.8em;">Закрыть</a> 
    </div> 
} 

Answer 1

您需要将您的对话框内的表单标签。你会注意到当你创建对话框并打开它时，它会将你的div移出你的表单。你会想：

<div id="registerDialog" title="Регистрация"> 
    @using (Html.BeginForm("Register", "Account", FormMethod.Post, new { id = "registerForm" })) 
    {  

     @Html.LabelFor(x => x.FirstName) 
     <br/> 
     @Html.TextBoxFor(x => x.FirstName, new { @class = "registerUser" }) 
     <br/> 
     @Html.ValidationMessageFor(x => x.FirstName)   
     <br/> 
     @Html.LabelFor(x => x.LastName)   
     <br/> 
     @Html.TextBoxFor(x => x.LastName, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.LastName)   
     <br/> 
     @Html.LabelFor(x => x.Email)   
     <br/> 
     @Html.TextBoxFor(x => x.Email, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Email)   
     <br/> 
     @Html.LabelFor(x => x.Password)   
     <br/> 
     @Html.TextBoxFor(x => x.Password, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Password)   
     <br/> 
     @Html.LabelFor(x => x.ConfirmPassword)   
     <br/> 
     @Html.TextBoxFor(x => x.ConfirmPassword, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.ConfirmPassword)         
     <br/> 
     @Html.CheckBoxFor(x => x.RememberYou) запомнить Вас?       
     <br/> 
     <br/> 
     @Html.ActionLink("Сохранить", "LogIn", "Account", null, new { @class = "accountBtn", style = "font-size: 0.8em;", id = "registerBtnSbmt" }) 
     <a href="#" class="accountBtn" id="closeRegisterDialog" style = "font-size: 0.8em;">Закрыть</a> 
    } 
</div> 

还有就是为什么发生这种情况在这个page

从底部的页面的解释：

一个对话框的要求是，它出现作为 最顶端的元素。唯一能够在 Internet Explorer中始终如一地完成此操作的方法是让该对话框成为 正文中的最后一个元素，因为它遵守z-index上的DOM顺序。通常有两种 变通办法：

move the dialog element back somewhere else in the dom in the open event callback. This has the potential to allow other elements to 

出现在对话框的顶部（见上文）

move the dialog content element somewhere else in the dom in the close event callback, before the submit. 

这些都不是适合建造中的对话框，并 留作建议的解决方法。正如这张票 建议的第一条评论，这需要更好地记录。

Answer 2

首先对不起之前没有回答，所以，去答案。

1. 在一个模态窗口，不能是可能的，这不行，原因是需要刷新页面，所以...
2. 为了解决这个问题，使用属性[要求]，并更改标题替换messagem默认值。 注：我承认，你得了解有关创建模式窗口，让我们的代码：（我使用ASP.NET MVC 5，它是HTML 5倍作品，旧版本没了）

这就是结果：