MVC.net jQuery驗證

Question

試圖避免的JavaScript多年後，IV使用JQuery在MVC asp.net validation開始，因爲似乎沒有做驗證的官方途徑，IV驚訝JQuery的有多好。

首先是有沒有辦法讓智能感知的jQuery和驗證插件的工作，讓我不必須學會API？

其次我該如何創建此驗證總之，目前追加錯誤的文本框中：

<script type="text/javascript"> 
$().ready(function() { 
$("#CreateLog").validate({ 
     rules: {    
      UserName: { 
       required: true, 
       minLength: 2, 

      } 
     }, 
     messages: { 

      UserName: { 
       required: "Please enter a username", 
       minLength: "Your username must consist of at least 2 characters", 

      } 
     } 
    }); 
}); 
</script> 

<form id="CreateLog" action="Create" method="post" /> 
     <label>UserName</label><br /> 
     <%=Html.TextBox("UserName")%> 
     <br /> 
      <div class="error"> </div> 
     <input type=submit value=Save /> 
     </form> 

我嘗試添加這劇本的權利：

errorLabelContainer: $("#CreateLog div.error") 

和這個html：

<div class="error"> </div> 

但是這沒有奏效。

Answer 1

嘗試在選項中指定包裝器和標籤容器。我也加了display：none;以error-container的樣式讓jquery決定何時顯示它。

HTML：

<div class="error-container"> 
<ul> 
</ul> 
</div> 
<form id="CreateLog" action="Create" method="post" /> 
<label>UserName</label><br /> 
<%=Html.TextBox("UserName")%> 
<br /> 
<input type=submit value=Save /> 
</form> 

腳本：

<script type="text/javascript"> 
$().ready(function() { 
$("#CreateLog").validate({ 
    errorLabelContainer: $("ul", $('div.error-container')), 
    wrapper: 'li', 
    rules: {    
     UserName: { 
      required: true, 
      minLength: 2, 

     } 
    }, 
    messages: { 

     UserName: { 
      required: "Please enter a username", 
      minLength: "Your username must consist of at least 2 characters", 

     } 
    } 
}); 
}); 
</script> 

這應該工作。

Answer 2

有一個Visual Studio 2008的修補程序爲VS2008JQuery IntelliSense。這也可能與SP1捆綁在一起。

Answer 3

關於jQuery（和其他插件）的智能感知：爲了在您自己的腳本文件中具有完整的智能感知，只需在您的.js文件的頂部爲您希望智能感知的每個文件添加一行：

/// <reference path="[insert path to script file here]" /> 

簡單，但非常有用=）

Answer 4

你可能想看看Karl Seguin的ASP.NET MVC驗證方法上CodeBetter.com和他的樣本application canvas。

Validation - Part 1 - Getting Started

Validation - Part 2 - Client-Side

Validation - Part 3 - Server-Side