Добавление элементов управления проверки в интерфейсы правки и вставки (C#)

Скотт Митчелл

Скачать в формате PDF

В этом руководстве мы посмотрим, насколько легко добавлять контроли проверки в EditItemTemplate и InsertItemTemplate веб-контроля данных, чтобы обеспечить более надежный пользовательский интерфейс.

Введение

Элементы управления GridView и DetailsView в примерах, которые мы изучили за последние три руководства, состоят из BoundFields и CheckBoxFields (типы полей, которые автоматически добавляются Visual Studio при привязке GridView или DetailsView к элементу управления источником данных с помощью смарт-тега). При редактировании строки в GridView или DetailsView эти boundFields, которые не доступны только для чтения, преобразуются в текстовые поля, из которых конечный пользователь может изменить существующие данные. Аналогичным образом при вставке новой записи в элемент управления DetailsView эти BoundFields, свойство которых InsertVisible имеет значение true (по умолчанию), отображаются в виде пустых текстовых полей, в которых пользователь может предоставить значения полей новой записи. Аналогичным образом, CheckBoxFields, отключенные в стандартном интерфейсе только для чтения, преобразуются в включенные флажки в интерфейсах редактирования и вставки.

Хотя редактирование и вставка интерфейсов по умолчанию для BoundField и CheckBoxField может оказаться полезным, интерфейс не имеет никакой проверки. Если пользователь ошибается в вводе данных, например пропустить поле ProductName или ввести недопустимое значение для UnitsInStock (например, –50), исключение будет вызвано из глубины архитектуры приложения. Хотя это исключение может быть корректно обработано, как показано в предыдущем руководстве, в идеале редактирование или вставка пользовательского интерфейса будет включать элементы управления проверкой, чтобы запретить пользователю вводить такие недопустимые данные в первую очередь.

Чтобы предоставить настраиваемый интерфейс редактирования или вставки, необходимо заменить BoundField или CheckBoxField на TemplateField. TemplateFields, которые были темой обсуждения в руководствах Using TemplateFields в элементе управления GridView и Using TemplateFields в элементе управления DetailsView, могут состоять из нескольких шаблонов, определяющих отдельные интерфейсы для различных состояний строк. Шаблон TemplateField ItemTemplate используется при отрисовке полей или строк только для чтения в элементах управления DetailsView или GridView, тогда как интерфейсы EditItemTemplate и InsertItemTemplate используются для режима редактирования и вставки соответственно.

В этом руководстве мы посмотрим, насколько легко добавить элементы управления для проверки в TemplateField с EditItemTemplate и InsertItemTemplate, обеспечивая более надежный пользовательский интерфейс. В частности, в этом руководстве приведен пример, созданный в руководстве по изучению событий, связанных с вставкой, обновлением и удалением , а также расширение интерфейсов редактирования и вставки для включения соответствующей проверки.

Шаг 1. Повторение примера из изучения событий, связанных с вставкой, обновлением и удалением

В руководстве по изучению событий, связанных с вставкой, обновлением и удалением, мы создали страницу, в которую перечислены имена и цены продуктов в редактируемом GridView. Кроме того, страница включала DetailsView, свойство которого DefaultMode было установлено на Insert, тем самым всегда отображаясь в режиме вставки. В этом detailsView пользователь может ввести имя и цену для нового продукта, нажать кнопку "Вставить" и добавить его в систему (см. рис. 1).

В предыдущем примере пользователи могут добавлять новые продукты и изменять существующие.

Рис. 1. Предыдущий пример позволяет пользователям добавлять новые продукты и изменять существующие (щелкните, чтобы просмотреть изображение полного размера)

Наша цель в этом руководстве — расширение DetailsView и GridView для предоставления элементов управления проверкой. В частности, наша логика проверки будет:

  • Требовать, чтобы имя было указано при вставке или редактировании продукта
  • Требовать, чтобы цена была предоставлена при вставке записи; при редактировании записи нам по-прежнему потребуется цена, но мы будем использовать программную логику в обработчике событий GridView RowUpdating, которая уже была рассмотрена в предыдущем руководстве.
  • Убедитесь, что значение, введенное для цены, является допустимым форматом валюты

Прежде чем мы рассмотрим расширение предыдущего примера, чтобы включить проверку, сначала необходимо реплицировать пример со DataModificationEvents.aspx страницы на страницу для этого руководства UIValidation.aspx. Для этого необходимо скопировать декларативную DataModificationEvents.aspx разметку страницы и его исходный код. Сначала скопируйте декларативную разметку, выполнив следующие действия:

  1. Откройте страницу DataModificationEvents.aspx в Visual Studio
  2. Перейдите к декларативной разметке страницы (нажмите кнопку "Источник" в нижней части страницы)
  3. Скопируйте текст внутри <asp:Content> и </asp:Content> тегов (строки 3–44), как показано на рис. 2.

Копирование текста в <элементе управления asp:Content>

Рис. 2. Копирование текста в <asp:Content> элементе управления (щелкните, чтобы просмотреть изображение полного размера)

  1. Откройте UIValidation.aspx страницу
  2. Перейдите к декларативной разметке страницы
  3. Вставьте текст в <asp:Content> элемент управления.

Чтобы скопировать исходный код, откройте DataModificationEvents.aspx.cs страницу и скопируйте только текст вEditInsertDelete_DataModificationEvents классе. Скопируйте три обработчика событий (Page_Load, GridView1_RowUpdatingи ObjectDataSource1_Inserting), но не копируйте объявление класса или using инструкции. Вставьте скопированный текст внутри класса EditInsertDelete_UIValidation в UIValidation.aspx.cs.

После переноса содержимого и кода из DataModificationEvents.aspx в UIValidation.aspx, найдите время, чтобы проверить свой прогресс в браузере. Вы должны увидеть одни и те же выходные данные и одинаковую функциональность на обеих страницах (см. рисунок 1, чтобы увидеть DataModificationEvents.aspx в действии).

Шаг 2. Преобразование BoundFields в TemplateFields

Чтобы добавить элементы управления проверки в интерфейсы редактирования и вставки, нужно преобразовать BoundFields, используемые в элементах управления DetailsView и GridView, в TemplateFields. Для этого щелкните ссылки "Изменить столбцы" и "Изменить поля" в смарт-тегах GridView и DetailsView соответственно. Там выберите каждый из BoundFields и щелкните ссылку "Преобразовать это поле в templateField".

Преобразуйте каждое BoundField элемента DetailsView и GridView в TemplateField

Рис. 3: Преобразуйте каждое BoundField элементов DetailsView и GridView в TemplateField (щелкните, чтобы просмотреть изображение полного размера)

Преобразование BoundField в TemplateField с помощью диалогового окна "Поля" создает TemplateField, который предоставляет те же интерфейсы для только чтения, редактирования и вставки, что и сам BoundField. В следующей разметке показан декларативный синтаксис поля ProductName в DetailsView после его преобразования в TemplateField:

<asp:TemplateField HeaderText="ProductName" SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </EditItemTemplate>
    <InsertItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </InsertItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Обратите внимание, что в этом поле шаблонов было автоматически создано три шаблона: ItemTemplate, EditItemTemplate, InsertItemTemplate. Отображается ItemTemplate одно значение поля данных (ProductName) с помощью веб-элемента управления Label, а EditItemTemplate и InsertItemTemplate отображают это значение в веб-элементе управления TextBox, который связывает поле данных со свойством Text TextBox посредством двусторонней привязки данных. Так как на этой странице мы используем только DetailsView для вставки, вы можете удалить ItemTemplate и EditItemTemplate из двух TemplateFields, хотя оставление их не причиняет вреда.

Так как GridView не поддерживает встроенные функции вставки DetailsView, преобразование поля GridView ProductName в TemplateField приводит только к ItemTemplate и EditItemTemplate.

<asp:TemplateField HeaderText="ProductName" SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Щелкнув "Преобразовать это поле в TemplateField", Visual Studio создал ШаблонФилд, шаблоны которого имитируют пользовательский интерфейс преобразованного BoundField. Это можно проверить, перейдя на эту страницу через браузер. Вы обнаружите, что внешний вид и поведение TemplateFields идентичны опыту при использовании BoundFields вместо этого.

Примечание.

При необходимости можно настроить интерфейсы редактирования в шаблонах. Например, может потребоваться, чтобы текстовое поле в UnitPrice TemplateFields отображалось как меньшее текстовое поле, чем текстовое ProductName поле. Для этого можно задать для свойства TextBox Columns соответствующее значение или указать абсолютную ширину через Width свойство. В следующем руководстве мы посмотрим, как полностью настроить интерфейс редактирования, заменив TextBox альтернативным веб-элементом управления записью данных.

Шаг 3. Добавление элементов управления проверки в GridViewEditItemTemplate

При создании форм ввода данных важно, чтобы пользователи вводили все необходимые поля и что все предоставленные входные данные являются законными, правильно отформатированными значениями. Чтобы убедиться, что входные данные пользователя допустимы, ASP.NET предоставляет пять встроенных элементов управления проверки, которые предназначены для проверки значения одного элемента управления входными данными:

  • RequiredFieldValidator гарантирует, что задано значение
  • CompareValidator проверяет значение на соответствие другому значению веб-элемента управления или константному значению или гарантирует, что формат значения является законным для указанного типа данных.
  • RangeValidator гарантирует, что значение находится в диапазоне значений
  • RegularExpressionValidator проверяет значение по регулярному выражению
  • CustomValidator проверяет значение по методу, определённому пользователем.

Дополнительные сведения об этих пяти элементах управления см. в разделе «Элементы управления проверкой» в Краткие руководства по ASP.NET.

Для работы с нашим руководством необходимо использовать RequiredFieldValidator как в DetailsView, так и в GridView ProductName TemplateField, и RequiredFieldValidator в UnitPrice TemplateField. Кроме того, нам потребуется добавить CompareValidator в TemplateFields каждого из элементов управления UnitPrice, чтобы гарантировать, что введенная цена имеет значение больше или равно 0 и представлена в допустимом формате валюты.

Примечание.

Хотя ASP.NET 1.x имели те же пять элементов управления проверки, ASP.NET 2.0 добавил ряд улучшений, основные два из которых поддерживают клиентские скрипты для браузеров, отличных от Internet Explorer, и возможность секционировать элементы управления проверкой на странице в группы проверки.

Начнем с добавления необходимых элементов управления проверки в EditItemTemplate GridView в TemplateFields. Для этого щелкните ссылку "Изменить шаблоны" из смарт-тега GridView, чтобы открыть интерфейс редактирования шаблона. Здесь можно выбрать шаблон для редактирования из раскрывающегося списка. Поскольку мы хотим расширить интерфейс редактирования, нам нужно добавить контролы валидации в ProductName и UnitPriceEditItemTemplate.

Нам нужно расширить ProductName и UnitPrice EditItemTemplates

Рис. 4. Нам нужно расширить ProductName и UnitPrice с EditItemTemplate (щелкните, чтобы просмотреть изображение полного размера)

В ProductNameEditItemTemplate добавьте RequiredFieldValidator, перетащив его из панели элементов в интерфейс редактирования шаблона и разместив после текстового поля.

Добавьте RequiredFieldValidator в ProductName EditItemTemplate

Рис. 5: Добавьте элемент RequiredFieldValidator в ProductNameEditItemTemplate (Щелкните, чтобы просмотреть изображение в полном размере)

Все элементы управления проверкой работают путем проверки входных данных одного веб-элемента управления ASP.NET. Поэтому нам нужно указать, что только что добавленный элемент управления RequiredFieldValidator должен проверять текстовое поле в EditItemTemplate; это достигается путем установки свойства ControlToValidate на идентификатор соответствующего веб-элемента управления. В настоящее время TextBox имеет довольно неписаный IDTextBox1код, но давайте изменим его на что-то более подходящее. Щелкните текстовое поле в шаблоне, а затем в окне свойств измените ID с TextBox1 на EditProductName.

Изменение идентификатора TextBox на EditProductName

Рис. 6. Измените текстовое поле IDEditProductName на (щелкните, чтобы просмотреть изображение полного размера)

Затем задайте для свойства RequiredFieldValidator ControlToValidate значение EditProductName. Наконец, задайте для свойства ErrorMessage значение "Необходимо указать имя продукта", а свойство Text — "*". Если для свойства Text задано значение, то это текст, который отображается элементом управления проверки, если проверка не проходит. Значение свойства ErrorMessage, которое является обязательным, используется элементом управления ValidationSummary; если значение свойства Text опущено, то значение свойства ErrorMessage также отображается элементом управления валидации при недопустимом вводе.

После задания этих трех свойств RequiredFieldValidator, экран должен выглядеть примерно как на рис. 7.

Установите свойства ControlToValidate, ErrorMessage и Text для RequiredFieldValidator.

Рис. 7: Задайте свойства RequiredFieldValidator: ControlToValidate, ErrorMessage и Text (щелкните, чтобы просмотреть изображение в полном размере)

После добавления RequiredFieldValidator в ProductNameEditItemTemplate, остаётся только добавить необходимую проверку в UnitPriceEditItemTemplate. Так как мы решили, что для этой страницы UnitPrice является необязательным при редактировании записи, нам не нужно добавлять RequiredFieldValidator. Однако необходимо добавить CompareValidator, чтобы обеспечить, что в случае, если UnitPrice задан, оно правильно отформатировано как валюта и больше или равно 0.

Прежде чем добавить CompareValidator в UnitPriceEditItemTemplate, сначала измените идентификатор элемента управления TextBox с TextBox2 на EditUnitPrice. После внесения этого изменения добавьте CompareValidator, присвойв свойству значение ControlToValidateEditUnitPriceErrorMessage "Цена должна быть больше или равно нулю и не может включать символ валюты", а его Text свойство — "*".

Чтобы указать, что значение UnitPrice должно быть больше или равно 0, установите для свойства Operator значение GreaterThanEqual, для свойства ValueToCompare значение "0", а для свойства Type значение Currency. В следующем декларативном синтаксисе показано UnitPrice TemplateField EditItemTemplate после внесённых изменений:

<EditItemTemplate>
    <asp:TextBox ID="EditUnitPrice" runat="server"
      Text='<%# Bind("UnitPrice", "{0:c}") %>'
      Columns="6"></asp:TextBox>
    <asp:CompareValidator ID="CompareValidator1" runat="server"
        ControlToValidate="EditUnitPrice"
        ErrorMessage="The price must be greater than or equal to zero and
                       cannot include the currency symbol"
        Operator="GreaterThanEqual" Type="Currency"
        ValueToCompare="0">*</asp:CompareValidator>
</EditItemTemplate>

После внесения этих изменений откройте страницу в браузере. Если вы пытаетесь опустить имя или ввести недопустимое значение цены при редактировании продукта, звездочка появится рядом с текстовым полем. Как показано на рисунке 8, значение цены, которое включает знак валюты, например $19,95, считается недопустимой. Функция CompareValidator CurrencyType разрешает использование разделителей цифр (например, запятых или точек, в зависимости от языковых и региональных настроек) и ведущего знака плюса или минуса, но не допускает символа валюты. В нынешнем виде интерфейс редактирования отображает UnitPrice в формате валюты, что может запутать пользователей.

Примечание.

Помните, что в руководстве по событиям, связанным с вставкой, обновлением и удалением, мы задали свойству DataFormatString BoundField {0:c} значение для форматирования его в виде валюты. Кроме того, мы устанавливаем свойство ApplyFormatInEditMode в значение true, что приводит к формату интерфейса редактирования GridView как валюту. При преобразовании BoundField в TemplateField Visual Studio отметил эти параметры и отформатировал содержимое TextBox Text в виде валюты с помощью синтаксиса <%# Bind("UnitPrice", "{0:c}") %> привязки данных.

Звездочка отображается рядом с текстовыми полями с недопустимыми входными данными

Рис. 8. Звездочка отображается рядом с текстовыми полями с недопустимыми входными данными (щелкните, чтобы просмотреть изображение полного размера)

Хотя проверка работает как есть, пользователь должен вручную удалить символ валюты при редактировании записи, что недопустимо. Чтобы устранить эту проблему, у нас есть три варианта:

  1. Настройте EditItemTemplate так, чтобы значение UnitPrice не форматировалось как валюта.
  2. Разрешить пользователю ввести символ валюты, удалив CompareValidator и заменив его на RegularExpressionValidator, который корректно проверяет правильно отформатированное значение валюты. Проблема заключается в том, что регулярное выражение для проверки значения валюты неудобное и потребует написания кода, если мы хотим включить региональные настройки.
  3. Удалите этот элемент управления проверкой, и вместо этого полагайтесь на логику проверки на стороне сервера в обработчике событий GridView RowUpdating.

Давайте пойдем с вариантом #1 для этого упражнения. В настоящее время UnitPrice форматируется как валюта из-за выражения привязки данных для текстового поля EditItemTemplate в <%# Bind("UnitPrice", "{0:c}") %>. Измените оператор Bind на Bind("UnitPrice", "{0:n2}"), который форматирует результат в виде числа с двумя десятичными знаками. Это можно сделать непосредственно с помощью декларативного синтаксиса или щелкнув ссылку "Edit DataBindings" в EditUnitPrice TextBox в UnitPrice TemplateField EditItemTemplate (см. Рисунки 9 и 10).

Щелкните ссылку

Рис. 9. Щелкните ссылку "Изменить DataBindings" в Текстовом поле (щелкните, чтобы просмотреть изображение полного размера)

Укажите описатель формата в инструкции Bind

Рис. 10. Укажите описатель формата в Bind инструкции (щелкните, чтобы просмотреть изображение полного размера)

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

Примечание.

Он UnitPriceEditItemTemplate не включает RequiredFieldValidator, позволяя выполнению обратной отправки и началу логики обновления. Однако обработчик событий, перенесённый из руководства «Изучение событий, связанных с вставкой, обновлением и удалением», включает программную проверку, которая гарантирует, что UnitPrice предоставлено. Вы можете удалить эту логику, оставить ее в исходном виде или добавить в нее UnitPriceEditItemTemplateОбязательныйПроверяющийПоле.

Шаг 4. Сводка проблем с записью данных

Помимо пяти элементов управления проверки, ASP.NET включает элемент управления ValidationSummary, который отображает ErrorMessage элементы управления проверки, которые обнаружили недопустимые данные. Эти сводные данные можно отображать как текст на веб-странице или через модальное текстовое поле сообщения на стороне клиента. Давайте расширим эту инструкцию, чтобы включить клиентскую всплывающую панель со сводкой проблем при проверке.

Для этого перетащите элемент управления ValidationSummary из панели элементов на конструктор. Расположение элемента управления "Проверка" не имеет значения, так как мы настроим его только для отображения сводки в виде сообщения. После добавления элемента управления установите свойство ShowSummary в false, а его свойство ShowMessageBox в true. С этим дополнением любые ошибки проверки суммируются в сообщении на стороне клиента.

Ошибки проверки суммируются в папке сообщений на стороне клиента

Рис. 11. Ошибки проверки суммируются в папке сообщений на стороне клиента (щелкните, чтобы просмотреть изображение полного размера)

Шаг 5. Добавление элементов управления проверки в detailsViewInsertItemTemplate

Все, что осталось для этого руководства, — добавить элементы управления проверки в интерфейс вставки DetailsView. Процесс добавления элементов управления для проверки в шаблонах DetailsView идентичен тому, что было рассмотрено на шаге 3; поэтому мы быстро справимся с задачей на этом шаге. Как мы сделали с GridView's EditItemTemplate s, я призываю вас переименовать ID s текстовых боксов из неописательных TextBox1 и TextBox2 на InsertProductName и InsertUnitPrice.

Добавьте RequiredFieldValidator в ProductNameInsertItemTemplate. Задайте ControlToValidate и ID параметр для TextBox в шаблоне, установите его свойство Text в "*", а его свойство ErrorMessage в "Имя продукта должно быть указано".

Поскольку UnitPrice требуется для этой страницы при добавлении новой записи, добавьте элемент RequiredFieldValidator в объект UnitPriceInsertItemTemplate, задав его свойства ControlToValidate, Text и ErrorMessage соответствующим образом. Наконец, добавьте CompareValidator также в UnitPriceInsertItemTemplate, настроив его свойства ControlToValidate, Text, ErrorMessage, Type, Operator и ValueToCompare, как мы сделали с UnitPrice CompareValidator в EditItemTemplate GridView.

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

Логика проверки добавлена в интерфейс добавления DetailsView

Рис. 12. Логика проверки добавлена в интерфейс вставки DetailsView (щелкните, чтобы просмотреть изображение полного размера)

Шаг 6. Секционирование элементов управления проверкой в группы проверки

Наша страница состоит из двух логически разрозненных наборов элементов управления проверкой: тех, которые соответствуют интерфейсу редактирования GridView и тем, которые соответствуют интерфейсу вставки DetailsView. По умолчанию, когда происходит обратная отправка, проверяются все элементы проверки на странице. Однако при редактировании записи мы не хотим, чтобы элементы управления проверки в интерфейсе DetailsView активизировались. Рис. 13 иллюстрирует текущую дилемму, когда пользователь редактирует продукт с совершенно юридическими значениями, щелкнув "Обновить", возникает ошибка проверки, так как значения имени и цены в интерфейсе вставки пусты.

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

Рис. 13: Обновление продукта вызывает срабатывание элементов управления вставного интерфейса (чтобы щелкнуть для просмотра изображения в полном размере)

Элементы управления проверки в ASP.NET 2.0 можно разделить на группы проверки через их ValidationGroup свойство. Чтобы связать набор элементов управления проверки в группе, просто задайте для свойства ValidationGroup то же значение. В нашем руководстве задайте свойства ValidationGroup элементов управления проверки в TemplateFields GridView и свойства ValidationGroup TemplateFields EditValidationControls и DetailsView на InsertValidationControls. Эти изменения можно вносить непосредственно в декларативную разметку или через окно свойств при использовании интерфейса шаблона редактирования конструктора.

Помимо элементов управления валидацией, элементы управления типа "Кнопка" и связанные с ними элементы в ASP.NET 2.0 также включают свойство ValidationGroup. Валидаторы группы проверки проверяются только в случае, если постбэк вызывается кнопкой с тем же настройкой свойства ValidationGroup. Например, чтобы кнопка "Вставка DetailsView" активировала InsertValidationControls группу проверки, необходимо задать для свойства CommandField ValidationGroup значение InsertValidationControls (см. рис. 14). Кроме того, задайте для свойства CommandField ValidationGroup в GridView значение EditValidationControls.

Задайте для свойства ValidationGroup элемента CommandField элемента управления DetailsView значение InsertValidationControls

Рис. 14. Задайте для свойства CommandField ValidationGroup DetailsView значение InsertValidationControls (щелкните, чтобы просмотреть изображение полного размера)

После этих изменений поля templateFields и CommandFields в DetailsView и GridView должны выглядеть следующим образом:

TemplateFields и CommandField в DetailsView

<asp:TemplateField HeaderText="ProductName"
  SortExpression="ProductName">
    <InsertItemTemplate>
        <asp:TextBox ID="InsertProductName" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2"
          runat="server" ControlToValidate="InsertProductName"
            ErrorMessage="You must provide the product name"
            ValidationGroup="InsertValidationControls">*
        </asp:RequiredFieldValidator>
    </InsertItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UnitPrice" SortExpression="UnitPrice">
    <InsertItemTemplate>
         <asp:TextBox ID="InsertUnitPrice" runat="server"
           Text='<%# Bind("UnitPrice") %>' Columns="6">
         </asp:TextBox>
         <asp:RequiredFieldValidator ID="RequiredFieldValidator3"
           runat="server" ControlToValidate="InsertUnitPrice"
            ErrorMessage="You must provide the product price"
            ValidationGroup="InsertValidationControls">*
         </asp:RequiredFieldValidator>
        <asp:CompareValidator ID="CompareValidator2" runat="server"
           ControlToValidate="InsertUnitPrice"
           ErrorMessage="The price must be greater than or equal to zero and
                          cannot include the currency symbol"
           Operator="GreaterThanEqual" Type="Currency" ValueToCompare="0"
           ValidationGroup="InsertValidationControls">*
        </asp:CompareValidator>
     </InsertItemTemplate>
 </asp:TemplateField>
<asp:CommandField ShowInsertButton="True"
  ValidationGroup="InsertValidationControls" />

Поле команд и шаблонные поля GridView

<asp:CommandField ShowEditButton="True" ValidationGroup="EditValidationControls" />
<asp:TemplateField HeaderText="ProductName"
  SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="EditProductName" runat="server"
          Text='<%# Bind("ProductName") %>'>
        </asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1"
            runat="server" ControlToValidate="EditProductName"
            ErrorMessage="You must provide the product name"
            ValidationGroup="EditValidationControls">*
        </asp:RequiredFieldValidator>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UnitPrice" SortExpression="UnitPrice">
    <EditItemTemplate>
        <asp:TextBox ID="EditUnitPrice" runat="server"
          Text='<%# Bind("UnitPrice", "{0:n2}") %>' Columns="6"></asp:TextBox>
        <asp:CompareValidator ID="CompareValidator1" runat="server"
            ControlToValidate="EditUnitPrice"
            ErrorMessage="The price must be greater than or equal to zero and
                           cannot include the currency symbol"
            Operator="GreaterThanEqual" Type="Currency"
            ValueToCompare="0"
            ValidationGroup="EditValidationControls">*
        </asp:CompareValidator>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label2" runat="server"
            Text='<%# Bind("UnitPrice", "{0:c}") %>'>
        </asp:Label>
    </ItemTemplate>
</asp:TemplateField>

На этом этапе элементы управления проверкой, относящиеся к редактированию, запускаются только при нажатии кнопки "Обновить" в GridView, а элементы управления проверкой для конкретной вставки срабатывают только при нажатии кнопки "Вставить" в DetailsView, решая проблему, показанную на рис. 13. Однако при этом изменении элемент управления ValidationSummary больше не отображается при вводе недопустимых данных. Элемент управления ValidationSummary также содержит ValidationGroup свойство и отображает сводную информацию только для элементов управления проверки в своей группе проверки. Поэтому на этой странице необходимо иметь два элемента управления проверки, один для InsertValidationControls группы проверки и один для EditValidationControls.

<asp:ValidationSummary ID="ValidationSummary1" runat="server"
    ShowMessageBox="True" ShowSummary="False"
    ValidationGroup="EditValidationControls" />
<asp:ValidationSummary ID="ValidationSummary2" runat="server"
    ShowMessageBox="True" ShowSummary="False"
    ValidationGroup="InsertValidationControls" />

С помощью этого дополнения наш учебник завершен!

Итоги

Хотя BoundFields может предоставлять интерфейс вставки и редактирования, интерфейс не настраивается. Как правило, мы хотим добавить элементы управления проверкой в интерфейс редактирования и вставки, чтобы убедиться, что пользователь вводит необходимые входные данные в юридическом формате. Для этого необходимо преобразовать BoundFields в TemplateFields и добавить элементы управления проверки в соответствующие шаблоны. В этом руководстве мы расширили пример из руководства по изучению событий, связанных с вставкой, обновлением и удалением , добавив элементы управления проверкой как в интерфейс вставки DetailsView, так и интерфейс редактирования GridView. Кроме того, мы узнали, как отобразить сведения о сводной проверке с помощью элемента управления ValidationSummary и как разделить элементы управления проверки на странице на отдельные группы проверки.

Как мы видели в этом руководстве, TemplateFields позволяет изменять и вставлять интерфейсы для включения элементов управления проверкой. TemplateFields также можно расширить для включения дополнительных входных веб-элементов управления, что позволяет заменить текстовое поле более подходящим веб-элементом управления. В следующем руководстве мы узнаем, как заменить элемент управления TextBox элементом управления DropDownList, связанным с данными, который идеально подходит при редактировании внешнего ключа (например CategoryID или SupplierID в таблице Products).

Счастливое программирование!

Об авторе

Скотт Митчелл, автор семи книг ASP/ASP.NET и основатель 4GuysFromRolla.com, работает с технологиями Microsoft Web с 1998 года. Скотт работает независимым консультантом, тренером и писателем. Его последняя книга Sams обучает ASP.NET 2.0 за 24 часа. С ним можно связаться по адресу mitchell@4GuysFromRolla.com.

Особое спасибо кому

Эта серия учебников была проверена многими полезными рецензентами. Ведущими рецензентами данного руководства были Лиз Шулок и Зак Джонс. Хотите просмотреть мои предстоящие статьи MSDN? Если да, напишите мне на mitchell@4GuysFromRolla.com.