Проверка на стороне клиента с аннотациями данных в ASP.Net MVC3

Question

Я использую ASP.Net MVC3 с VB.

Мне удалось получить проверку на стороне сервера с работающими аннотациями данных.Ниже мой соответствующий код:

На мой взгляд модель:

   <Required(ErrorMessage:="Last Name is Required.")>
        Public Property SearchLName() As String

        <Required(ErrorMessage:="First Name is Required.")>
        Public Property SearchFName() As String

        <Required(ErrorMessage:="Zip Code is Required.")>
        <RegularExpression("^[0-9]{5}", ErrorMessage:="Zip Code must be 5 digits long and contain only numbers.")>

В моей форме на вид:

  <div><%= Html.LabelFor(Function(model) model.SearchFName)%>
       <%= Html.TextBoxFor(Function(model) model.SearchFName)%></div>
    <p><%= Html.ValidationMessageFor(Function(model) model.SearchFName)%></p>

 <div><%= Html.LabelFor(Function(model) model.SearchLName)%>
      <%= Html.TextBoxFor(Function(model) model.SearchLName)%></div>
   <p><%= Html.ValidationMessageFor(Function(model) model.SearchLName)%></p>

  <div><%= Html.LabelFor(Function(model) model.SearchZip)%>
       <%= Html.TextBoxFor(Function(model) model.SearchZip)%></div>
    <p><%= Html.ValidationMessageFor(Function(model) model.SearchZip)%></p>

Проверка на стороне сервера работает отлично.Однако я не уверен, как заставить работать на стороне клиента.Я импортировал следующие сценарии JQuery, но, похоже, это не имеет значения.

<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>

Может кто-нибудь сказать мне, какой шаг я пропускаю?Спасибо.

РЕДАКТИРОВАТЬ:

В качестве дополнительной информации может быть полезна следующая информация.Моя веб-конфигурация имеет следующие настройки:

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

Моя главная страница содержит следующее в заголовке, и я убедился, что мой файл jquery имеет ту же версию, что и ссылка.

<script src="<%: Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script>

Я МОГУ заставить работать проверку на стороне клиента - добавив определенные html-элементы, которые ссылаются на точный тип ошибки, которая может возникнуть (см. Это, как указано в одном из ответов: http://msdn.microsoft.com/en-us/vs2010trainingcourse_aspnetmvccustomvalidation_topic5). Однако у этого есть две проблемы:1) Он никогда не выполняет проверку на стороне сервера, поэтому это будет проблемой, если у кого-то отключен JavaScript, и 2) мое представление должно знать о типе ошибок, которые могут возникнуть, поэтому для каждой аннотации данных, которую я добавляю в модель,Мне нужно добавить еще один тип ошибки в представление.

Я нашел эту статью полезной, рассказывающей о том, как настроить проверку на стороне клиента и на сервере: http://weblogs.asp.net/scottgu/archive/2010/01/15/asp-net-mvc-2-model-validation.aspx

Тем не менее, это не работает для меня, и я подумал, что, возможно, это потому, что он сосредоточен на MVC2.Мне удалось получить функцию на стороне сервера, но не на стороне клиента.

РЕДАКТИРОВАТЬ: На данный момент я откладываю беспокойство по поводу проверки на стороне клиента, так как на стороне сервераважнееЯ посмотрю, что я могу сделать с настройкой клиентской части после того, как остальная часть приложения заработает.Если я когда-нибудь выясню, что я сделал неправильно, я обновлю этот пост.

Answer 1

У вас также есть

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

в вашем web.config?

Над сценариями, на которые вы ссылались, вам также потребуется ссылка на jQuery

// put in the reference to whatever version of jQuery you're using 
<script src="<%: Url.Content("~/Scripts/jquery-1.6.2.min.js") %>" type="text/javascript"></script>
<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>

Также обратите внимание на Упражнение MSDN 4: Использование ненавязчивого jQuery на стороне клиента.

Answer 2

Ты должен делать что-то не так. Вот шаги, которые прекрасно работают для меня.

1. Создание нового проекта ASP.NET MVC 3 с использованием Интернет-шаблона

2. Определить модель:

   Imports System.ComponentModel.DataAnnotations
   
   Public Class MyViewModel
       <Required(ErrorMessage:="Last Name is Required.")>
       Public Property SearchLName() As String
   
       <Required(ErrorMessage:="First Name is Required.")>
       Public Property SearchFName() As String
   
       <Required(ErrorMessage:="Zip Code is Required.")>
       <RegularExpression("^[0-9]{5}", ErrorMessage:="Zip Code must be 5 digits long  and contain only numbers.")>
       Public Property SearchZip() As String
   End Class
   

3. Изменить HomeController примерно так:

   Public Class HomeController
       Inherits System.Web.Mvc.Controller
   
       Function Index() As ActionResult
           Return View(New MyViewModel)
       End Function
   
       <HttpPost()>
       Function Index(model As MyViewModel) As ActionResult
           Return View(model)
       End Function
   End Class
   

4. Изменить Index.aspx посмотреть так:

   <%@ Page Language="VB" Inherits="System.Web.Mvc.ViewPage(Of MvcApplication1.MyViewModel)" %>
   <!DOCTYPE html>
   <html>
   <head>
       <meta charset="utf-8" />
       <script src="<%= Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script>
       <script src="<%= Url.Content("~/Scripts/jquery.validate.js") %>" type="text/javascript"></script>
       <script src="<%= Url.Content("~/Scripts/jquery.validate.unobtrusive.js") %>" type="text/javascript"></script>
   </head>
   <body>
       <% Using Html.BeginForm() %>
           <div>
               <%= Html.LabelFor(Function(model) model.SearchFName)%>
               <%= Html.TextBoxFor(Function(model) model.SearchFName)%>
           </div>
           <p><%= Html.ValidationMessageFor(Function(model) model.SearchFName)%></p>
   
           <div>
               <%= Html.LabelFor(Function(model) model.SearchLName)%>
               <%= Html.TextBoxFor(Function(model) model.SearchLName)%>
           </div>
           <p><%= Html.ValidationMessageFor(Function(model) model.SearchLName)%></p>
   
           <div>
               <%= Html.LabelFor(Function(model) model.SearchZip)%>
               <%= Html.TextBoxFor(Function(model) model.SearchZip)%>
           </div>
           <p><%= Html.ValidationMessageFor(Function(model) model.SearchZip)%></p>
   
           <input type="submit" value="OK" />
       <% End Using %>
   </body>
   </html>