Язык программирования C#9 и платформа .NET5

Троелсен Эндрю

Кроме того, вспомогательная функция дескриптора для элемента ввода добавит атрибуты

type

из HTML5, основываясь на аннотациях данных. В табл. 31.4 перечислены некоторые распространенные аннотации и генерируемые атрибуты

type

из HTML5.

Шаблон

редактирования

Car.cshtml

содержит дескрипторы

<input>

для свойств

PetName

и

Color

. В качестве напоминания ниже приведены только эти дескрипторы:

<input asp-for="PetName" class="form-control" />

<input asp-for="Color" class="form-control"/>

Вспомогательная функция дескриптора для элемента ввода добавляет к визуализируемому дескриптору атрибуты

name

и

id

, существующее значение для свойства (если оно есть) и атрибуты проверки достоверности HTML5. Оба поля являются обязательными и имеют ограничение на длину строки в 50 символов. Вот визуализированная разметка для указанных двух свойств:

<input class="form-control" type="text" data-val="true"

data-val-length="The field Pet

Name must be a string with a

maximum length of 50." data-val-length-max="50"

data-val-

required="The Pet Name field is required."

id="PetName" maxlength="50" name="PetName"

value="Zippy">

<input class="form-control valid" type="text" data-val="true"

data-val-length="The field

Color must be a string with a

maximum length of 50."

data-val-length-max="50"

data-val-

required="The Color field is required."

id="Color" maxlength="50" name="Color" value="Black"

aria-describedby="Color-error" aria-invalid="false">

Вспомогательная функция дескриптора для текстовой области

Вспомогательная функция дескриптора для текстовой области (

<textarea>

) автоматически добавляет атрибуты

id

и

name

и любые атрибуты проверки достоверности HTML5, определенные для свойства. Например, следующая строка создает дескриптор

<textarea>

для свойства

Description

:

<textarea asp-for="Description"></textarea>

Вспомогательная функция дескриптора для элемента выбора

Вспомогательная функция дескриптора для элемента выбора (

<select>

) создает дескрипторы ввода с выбором из свойства модели и коллекции. Как и в других вспомогательных

функциях дескрипторов для элементов ввода, к разметке автоматически добавляются атрибуты

id

и

name

, а также любые атрибуты

data-val

из HTML5. Если значение свойства модели совпадает с одним из значений в списке, тогда для этого варианта в разметку добавляется атрибут

selected

.

Например, пусть имеется модель со свойством по имени

Country

и список

SelectList

по имени

Countries

с таким определением:

public List<SelectListItem> Countries { get; } = new List<SelectListItem>

{

new SelectListItem { Value = "MX", Text = "Mexico" },

new SelectListItem { Value = "CA", Text = "Canada" },

new SelectListItem { Value = "US", Text = "USA" },

};

Следующая разметка будет визуализировать дескриптор

<select>

с надлежащими дескрипторами

<option>

:

<select asp-for="Country" asp-items="Model.Countries"></select>

Если значением свойства

Country

является

CA

, тогда в представление будет выведена показанная ниже разметка:

<select id="Country" name="Country">

<option value="MX">Mexico</option>

<option selected="selected" value="CA">Canada</option>

<option value="US">USA</option>

</select>

Вспомогательные функции дескрипторов для проверки достоверности

Вспомогательные функции дескрипторов для сообщения проверки достоверности и для сводки по проверке достоверности в точности отражают вспомогательные функции HTML с именами

Html.ValidationMessageFor

и

Html.ValidationSummaryFor

. Первая применяется к HTML-дескриптору

<span>

для отдельного свойства модели, а вторая — к HTML-дескриптору

<div>

для целой модели. Сводка по проверке достоверности поддерживает варианты

Аll

(все ошибки),

ModelOnly

(ошибки только модели, но не свойств модели) и

None

(никаких ошибок).

Вспомните вспомогательные функции дескрипторов для проверки достоверности из

EditorTemplate

в файле

Car.cshtml

(выделены полужирным):

<div asp-validation-summary="All" class="text-danger"></div>

<div class="form-group">

<label asp-for="PetName" class="col-form-label"></label>

<input asp-for="PetName" class="form-control" />