Question

我已经将表单动态加载到jquery ui对话框中。现在我想在此对话框中添加客户端验证。我已经尝试了Scott Gu的博客，这一切都运行良好但不影响对话框（当我在对话框中使用表单时没有“标题必需”的错误消息）到我只使用普通的Url时。我已经尝试过jquery.validate，其规则和消息类似于在Jquery模式对话框中提问Mvc2客户端验证的答案？并且在对话框中仍然没有显示任何不同，当我单击提交按钮时，它仍然显示成功。（我确定我的方法与此相符）

我可以操作辅助类来防止更大的最大长度输入，但是它的最小长度和我正在努力的所需数据字段。我已经尝试过使用我能想到的所有javascripts，比如MvcJQueryValidation，但仍然没有。

请帮助任何人谢谢

Answer 1

以下是您可以继续操作的示例。始终以视图模型开始，该视图模型将表示部分内部的表单数据：

public class MyViewModel
{
    [Required]
    public string Foo { get; set; }
    public string Bar { get; set; }
}

然后是控制器：

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult Dialog()
    {
        return PartialView(new MyViewModel());
    }

    [HttpPost]
    public ActionResult Dialog(MyViewModel model)
    {
        if (!ModelState.IsValid)
        {
            return View(model);
        }

        // TODO: the model is valid => process ...
        return Json(new { success = "thanks for submitting" });
    }
}

最后是观点。

~/Views/Home/Index.aspx：

<%@ Page 
    Language="C#" 
    MasterPageFile="~/Views/Shared/Site.Master" 
    Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Home Page
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<script type="text/javascript" src="<%: Url.Content("~/scripts/jquery-1.4.1.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/scripts/jquery-ui-1.8.11.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/scripts/MicrosoftAjax.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/scripts/MicrosoftMvcValidation.js") %>"></script>
<script type="text/javascript">
    $(function () {
        $('#show').click(function () {
            $('#dialog').load(this.href, function (result) {
                Sys.Mvc.FormContext._Application_Load();
                $('#myForm').submit(function () {
                    if (!Sys.Mvc.FormContext.getValidationForForm(this).validate('submit').length) {
                        $.post(this.action, $(this).serialize(), function (data) {
                            if (data.success) {
                                alert(data.success);
                                $('#dialog').dialog('close');
                            } else {
                                $('#dialog').html(data);
                            }
                        });
                    }
                    return false;
                });
            }).dialog({ autoOpen: true });
            return false;
        });
    });
</script>

<%= Html.ActionLink("Show jquery dialog", "Dialog", null, new { id = "show" })%>

<div id="dialog"></div>

</asp:Content>

最后是部分（~/Views/Home/Dialog.ascx）：

<%@ Control 
    Language="C#" 
    Inherits="System.Web.Mvc.ViewUserControl<AppName.Models.MyViewModel>" %>

<% Html.EnableClientValidation(); %>

<% using (Html.BeginForm(null, null, FormMethod.Post, new { id = "myForm" })) { %>
    <div>
        <%= Html.EditorFor(x => x.Foo)%>
        <%= Html.ValidationMessageFor(x => x.Foo) %>
    </div>
    <div>
        <%= Html.EditorFor(x => x.Bar)%>
        <%= Html.ValidationMessageFor(x => x.Bar) %>
    </div>
    <input type="submit" value="OK" />
<% } %>

一旦加载对话框就会发生重要的部分，表格被注入DOM =＆gt;您需要使用Sys.Mvc.FormContext.getValidationForForm方法重新解析验证规则。

Jquery对话框客户端验证“必需!!” asp.net mvc2的字段

1 个答案: