模型验证在jquery对话框中不起作用
模型验证在jquery对话框中不起作用
提问于 2012-02-09 02:59:23
我使用的是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>
}Stack Overflow用户
回答已采纳
发布于 2012-02-09 03:33:41
您需要在对话框内移动表单标记。您会注意到，当您创建对话框并打开它时，它会将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顺序。通常有两种变通方法：
在open event回调中，将对话框元素移回dom中的其他位置。这有可能允许其他元素
出现在对话框的顶部(见上)
在提交之前，在close事件回调中将对话框内容元素移动到dom中的其他位置。
这两种方法都不适合构建到对话框中，并保留为建议的解决方法。正如这张票据上的第一条评论所暗示的那样，这需要更好地记录下来。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9199700
复制相关文章
相似问题
腾讯云开发者
