Язык программирования C#9 и платформа .NET5 - Эндрю Троелсен
Вспомогательная функция дескриптора для действия формы
Вспомогательная функция дескриптора для действия формы используется в элементах кнопок и изображений с целью изменения действия содержащей их формы. Например, следующая кнопка, добавленная к форме редактирования, вызовет передачу запроса POST конечной точке Create:
<button type="submit" asp-action="Create">Index</button>
Вспомогательная функция дескриптора для якоря
Вспомогательная функция дескриптора для якоря (<а>) заменяет вспомогательную функцию HTML с именем Html.ActionLink(). Скажем, чтобы создать ссылку на представление RazorSyntax, применяйте такой код:
<a class="nav-link text-dark" asp-area="" asp-controller="Home"
asp-action="RazorSyntax">
Razor Syntax
</a>
Для добавления страницы синтаксиса Razor в меню модифицируйте _Menu.cshtml, как показано ниже, добавив новый элемент меню между элементами Home (Домой) и Privacy (Секретность) (дескрипторы <li>, окружающие дескрипторы якорей, предназначены для меню Bootstrap):
...
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="Home"
asp-action="Index">Home</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="Home"
asp-action="RazorSyntax">Razor Syntax</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="Home"
asp-action="Privacy">Privacy</a>
</li>
Вспомогательная функция дескриптора для элемента ввода
Вспомогательная функция дескриптора для элемента ввода (<input>) является одной из наиболее универсальных. В дополнение к автоматической генерации атрибутов id и name стандарта HTML, а также любых атрибутов data-val стандарта HTML5, вспомогательная функция дескриптора строит надлежащую HTML-разметку, основываясь на типе данных целевого свойства. В табл. 31.3 перечислены типы HTML, которые создаются на базе типов .NET Core свойств.
Кроме того, вспомогательная функция дескриптора для элемента ввода добавит атрибуты 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" />
<span asp-validation-for="PetName" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="MakeId" class="col-form-label"></label>
<select asp-for="MakeId" class="form-control" asp-items="ViewBag.MakeId"></select>
</div>
<div class="form-group">
<label asp-for="Color" class="col-form-label"></label>
<input asp-for="Color" class="form-control"/>
<span asp-validation-for="Color" class="text-danger"></span>
</div>
Эти вспомогательные функции дескрипторов будут отображать ошибки модели, возникшие во время привязки и проверки достоверности, как показано на рис. 31.3.
Вспомогательная функция дескриптора для среды
Вспомогательная функция дескриптора для среды (<environment>) обычно используется для условной загрузки файлов JavaScript и CSS (или подходящей разметки) на основе среды, в которой запущен сайт. Откройте частичное представление _Head.cshtml и модифицируйте разметку следующим образом:
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - AutoLot.Mvc</title>
<environment include="Development">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
</environment>
<environment exclude="Development">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
</environment>
<link rel="stylesheet" href="~/css/site.css" />
