客戶端驗證從哪個使用部分視圖

Question

我剛剛完成了我的窗體的可視化邏輯，現在我想要使用asp.net mvc 3提供的客戶端驗證。然而，即使我正在追蹤一些例子，我也無法使其發揮作用，我不知道可能是什麼原因。

這裏是我的主視圖：

@model List<DataAccess.MCS_DocumentFields> 

@{ 
    ViewBag.Title = "Documents"; 
} 

<div id="drawForm"> 
@using (Html.BeginForm("RecieveDataFromDocument", "Forms", FormMethod.Post)) 
{ 
    @Html.ValidationSummary(true) 
    <table border="1"> 
     <colgroup> 
      <col span="1" style="width: 10%;" /> 
      <col span="1" style="width: 40%;" /> 
      <col span="1" style="width: 25%;" /> 
      <col span="1" style="width: 25%;" /> 
     </colgroup> 
     @Html.Partial("_PartialHeader", Model) 
     @Html.Partial("_PartialDrawing", Model) 
     @Html.Partial("_PartialBody", Model) 
     @Html.Partial("_PartialFooter", Model) 
    </table> 
    if (ViewBag.Status == 1) 
    { 
     <button type="submit">Save</button> 
    } 
    else 
    { 
     @Html.ActionLink("Back", "Index") 
    } 
} 
</div> 

沒有太多的實際這裏。大部分邏輯都在我的偏見中。我使用數據註釋，所以我認爲默認情況下會有一些客戶端驗證，但似乎並非如此。我所做的是確保我有

<appSettings> 

    <add key="UnobtrusiveJavaScriptEnabled" value="true" /> 

</appSettings> 

添加到我的web.config。在我看來，你可以看到我已經添加了

@Html.ValidationSummary(true) 

不知道這是否正確，但它在那裏。此外，在我是從那裏尋找的例子是：

<div class="editor-label"> 

    @Html.LabelFor(model => model.Name) 

</div> 

<div class="editor-field"> 

    @Html.TextBoxFor(model => model.Name) 

    @Html.ValidationMessageFor(model => model.Name) 

</div> 

我沒有這樣<div>標籤和這樣的類名但是當我開始在viewsource我的應用程序可以看到每個輸入此：

Name comes from DB 
       <input data-val="true" data-val-required="The FieldValue field is required." name="[4].FieldValue" type="hidden" value="Name comes from DB" /> 

我認爲這足以讓客戶端驗證發生。但是，因爲我沒有得到任何我在我的部分觀點一個僅增加了測試以下：

<div class="editor-label"> 
        @Html.DisplayFor(x => Model[i].QuestionText) 
        </div> 
        <div class="editor-field"> 
        @Html.TextBox("datepicker", "", new { @class = "datepicker" }) 
        @Html.ValidationMessageFor(x => Model[i].QuestionText) 
        </div> 
        @Html.HiddenFor(x => Model[i].Id) 
        //...some code... 
        <div class="editor-field"> 
        @Html.EditorFor(x => Model[i].FieldValue) 
        @Html.ValidationMessageFor(x => Model[i].FieldValue) 
        </div> 
        @Html.HiddenFor(x => Model[i].Id) 
        //...more code.. 

但即使是這兩個領域在驗證失敗時不會生成錯誤。所以我想我要麼錯過了什麼，要麼我做錯了什麼。我懷疑這種驗證是否以這種方式發揮作用 - 部分？

Answer 1

更換

@Html.Partial("_PartialHeader", Model) 
@Html.Partial("_PartialDrawing", Model) 
@Html.Partial("_PartialBody", Model) 
@Html.Partial("_PartialFooter", Model) 

在mvc客戶端驗證（我在mvc4上工作，但我認爲它在你的情況是一樣的），有一些步驟來檢查：

1. 在Web中。配置

   <add key="ClientValidationEnabled" value="true" /> 
   <add key="UnobtrusiveJavaScriptEnabled" value="true" /> 
   

2. 腳本具有在佈局（或主頁）

   <script src="/Scripts/jquery.validate.js"></script> 
   <script src="/Scripts/jquery.validate.unobtrusive.js"></script> 
   <script src="/Scripts/jquery.unobtrusive-ajax.js"></script> 
   

3. 給模型驗證錯誤消息屬性來顯示（例如）

   public class ContactForm 
   { 
   [Display(Name = "Mail :"), 
   Required(AllowEmptyStrings = false, ErrorMessage = "Mail required"), 
   RegularExpression("^(|[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+[.][a-zA-Z]{2,3})$", ErrorMessage = "Mail not valid"), 
   Remote("IsValidMail", "Validate", HttpMethod="GET")] /* remote validation */ 
   public string Mail { get; set; } 
   
   [Display(Name = "Message :"), 
   Required(AllowEmptyStrings = false, ErrorMessage = "Message required"), 
   StringLength(maximumLength: 400, ErrorMessage="Message too long")] 
   public string Message { get; set; } 
   
   public ContactForm() { } 
   

   }

4. 在視圖中，顯示錯誤消息

   @Html.ValidationMessageFor(x=>x.Mail) 
   

   或

   @Html.ValidationSummary(false, null, new { @id = "ValidationSummary" })  
   

   像你一樣。你可能需要在頁面加載（在ajax調用的成功事件或$（function（）{}）中重新綁定驗證。局部視圖）

   ///because the page is loaded with ajax, the validation rules are lost, we have to rebind them: 
       $('#form').removeData('validator'); 
       $('#form').removeData('unobtrusiveValidation'); 
       $("#form").each(function() { $.data($(this)[0], 'validator', false); }); //enable to display the error messages 
       $.validator.unobtrusive.parse("#form"); 
   

小心局部視圖不要雙擊腳本並啓用驗證。

Answer 2

嘗試添加這些文件，也許可以幫助你：

<script src="/@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript">  </script> 
<script src="/@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"  type="text/javascript"></script> 

<script src="/@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script> 
<script src="/@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script> 
<script src="/@Url.Content("~/Scripts/MicrosoftMvcValidation.js")" type="text/javascript"></script> 

Answer 3

只是出於興趣，你有沒有試過，以獲得與

@Html.EditorFor(m => Model, "_PartialHeader") 
@Html.EditorFor(m => Model, "_PartialDrawing") 
@Html.EditorFor(m => Model, "_PartialBody") 
@Html.EditorFor(m => Model, "_PartialFooter")