Проверка ASP.NET MVC - Как я могу изменить HTML, который выводится механизмом проверки MVC?

Question

При использовании проверки ASP.NET MVC на формах сообщения об ошибках выводятся в определенном html. Как, например, если вы проверяете текстовое поле, которое должно быть заполнено, выходные данные после сбоя проверки будут выглядеть так:

<label for="MonkeyName">Name: </label>
<span class="field-validation-error">*</span>
<br />
<input class="input-validation-error" id="MonkeyName" name="MonkeyName" type="text" value="" />

В приведенном выше коде тег span был автоматически сгенерирован средой проверки, и в текстовое поле был добавлен класс с именем input-validation-error. Но что, если я хочу, чтобы валидатор генерировал другой html?

Я хотел бы использовать среду проверки MVC, однако я хотел бы иметь полный контроль над способом отображения сообщений проверки, особенно потому, что MVC обещает контроль над пользовательским интерфейсом. HTML и CSS, которые я разработал (даже прежде, чем принять решение об использовании языка программирования на стороне сервера), отличаются для сообщений об ошибках, потому что я хочу установить класс с контейнером текстового поля, а не с самим текстовым полем. Возьмите это как пример:

<dl class="error">
  <dt>
    <label for="email">Email</label>
      <span class="required">Required</span> 
  </dt>
  <dd>
    <input class="textinput_med" id="FromEmail" name="FromEmail" type="text" value="" />
    <a href="#"><img src="Content/images/structure/help.png" width="30" height="30" alt="Help" /></a> 
    <span class="errormessage">Some Error</span> 
  </dd>
</dl>

Хотя у меня есть span для сообщения об ошибке, я бы хотел установить тег контейнера (dl) с классом css с именем error. Есть ли способ, которым я могу определить способ отображения сообщений об ошибках в рамках структуры проверки?

Примечание: хотя я думал о решении с jQuery, которое обнаруживает поля формы, которые имеют класс 'input-validation-error', и устанавливает их соответствующие контейнеры с моим пользовательским классом css 'error', я не думаю, что это хорошее решение, и я думаю, что это обходной путь для чего-то, что могло бы быть лучше. Я могу обновить MVC 2 до MVC 3, если это решит проблему.

Answer 1

Один из возможных вариантов - использование ненавязчивого сценария проверки ASP.NET MVC для поиска всех элементов в форме с атрибутом data-valmsg-for="inputName" и его тегов field-validation-error.учебный класс.Таким образом, вы можете работать с существующей функциональностью, добавив этот атрибут в ваш контейнер:

<dl data-valmsg-for="FromEmail" data-valmsg-replace="false">
  <dt>
    <label for="email">Email</label>
    <span class="required">Required</span> 
  </dt>
  <dd>
    <input class="textinput_med" id="FromEmail" name="FromEmail" type="text" value="" />
    <a href="#"><img src="Content/images/structure/help.png" width="30" height="30" alt="Help" /></a> 
  </dd>
</dl>

Затем <dl> получит класс field-validation-error в дополнение к <input>.Недостатком здесь является то, что вы потеряете сообщение об ошибке проверки.Если вы используете сводку проверки, возможно, это не будет проблемой (и вы можете контролировать этот контейнер, пометив контейнер с помощью data-valmsg-summary="true" и поместив в него <ul>).

Если работаетв рамках не работает для вас, вы всегда можете настроить jquery.validate.unobtrusive.js по своему вкусу.Код стилизации / размещения ошибки становится довольно простым, когда вы обдумываете его (в частности, посмотрите на функции onError и onErrors в строках 39 и 55).

Answer 2

Похоже, вам нужно написать другой метод расширения, который редактирует их содержимое

namespace HtmlExtensions
{
    public static HtmlString CustomValidateFor(this HtmlHelper helper, ...)
    {
        return Edit(helper.ValidateFor(...))
    }
}