2011-06-28 53 views
0

我已經動態地將表單加載到jQuery UI對話框中。現在我想添加客戶端驗證到這個對話框。我已經嘗試過Scott Gu的博客,並且它工作的很好,但不會影響對話框(當我在對話框中使用窗體時,沒有「需要標題」的錯誤消息),而只是使用普通Url。 我試過jquery.validate的規則和消息類似的問題Mvc2客戶端驗證在JQuery模式對話框中的答案?而且在對話框中仍然沒有顯示任何不同的內容,當我點擊提交按鈕時它仍然顯示爲成功。 (我敢肯定我在這條線上)Jquery對話框客戶端驗證「Required !!」字段與asp.net mvc2

我可以操縱助手類,以防止更大的最大長度輸入,但它的最小長度和我所掙扎的所需數據字段。我試過用MvcJQueryValidation所能想到的所有javascript,但仍然沒有任何結果。

請幫助任何人謝謝

回答

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最重要的部分發生=>需要使用Sys.Mvc.FormContext.getValidationForForm方法重新分析驗證規則。