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

  • Статья

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

Загрузить PDF-файл

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

Введение

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

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

Чтобы предоставить настраиваемый интерфейс редактирования или вставки, необходимо заменить BoundField или CheckBoxField на TemplateField. TemplateFields, которые были темой обсуждения в разделах Using TemplateFields in the GridView Control Control и Using TemplateFields в руководствах DetailsView Control , могут состоять из нескольких шаблонов, определяющих отдельные интерфейсы для разных состояний строк. 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.vb и скопируйте только текст вEditInsertDelete_DataModificationEvents классе . Скопируйте три обработчика событий (Page_Load, GridView1_RowUpdatingи ObjectDataSource1_Inserting), но не копируйте объявление класса. Вставьте скопированный текст вEditInsertDelete_UIValidation класс в UIValidation.aspx.vb.

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

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

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

Преобразование каждого из полей BoundFields DetailsView и GridView в templateFields

Рис. 3. Преобразование каждого из полей BoundFields DetailsView и GridView в TemplateFields (щелкните для просмотра полноразмерного изображения)

Преобразование 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>

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

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

<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 создал TemplateField, шаблоны которого имитируют пользовательский интерфейс преобразованного BoundField. Это можно проверить, перейдя на эту страницу в браузере. Вы обнаружите, что внешний вид и поведение TemplateFields идентичны интерфейсу, когда вместо этого были использованы BoundFields.

Примечание

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

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

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

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

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

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

Примечание

Хотя в ASP.NET 1.x были те же пять элементов управления проверкой, в ASP.NET 2.0 добавлен ряд улучшений, два main — поддержка клиентских скриптов для браузеров, отличных от Интернет-Обозреватель и возможность секционирования элементов управления проверкой на странице в группы проверки. Дополнительные сведения о новых функциях элементов управления проверкой в версии 2.0 см. в разделе Разбор элементов управления проверкой в ASP.NET 2.0.

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

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

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

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

Добавление RequiredFieldValidator в productName EditItemTemplate

Рис. 5. Добавление RequiredFieldValidator в ProductNameEditItemTemplate (Щелкните для просмотра полноразмерного изображения)

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

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

Рис. 6. Изменение элемента TextBox ID на EditProductName (Щелкните для просмотра полноразмерного изображения)

Затем задайте для свойства 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, присвоив его ControlToValidate свойству EditUnitPriceзначение , его ErrorMessage свойству значение "Цена должна быть больше или равна нулю и не может включать символ валюты", а свойство Text — "*".

Чтобы указать, что UnitPrice значение должно быть больше или равно 0, присвойте свойствуGreaterThanEqualОператора CompareValidator значение , свойству 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 с использованием формата валюты.

Примечание

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

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

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

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

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

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

Щелкните ссылку Edit DataBindings (Изменение dataBindings) элемента TextBox.

Рис. 9. Щелкните ссылку Edit DataBindings элемента TextBox (Щелкните для просмотра полноразмерного изображения)

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

Рис. 10. Указание описатель формата в операторе Bind (щелкните для просмотра полноразмерного изображения)

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

Примечание

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

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

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

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

Ошибки проверки отображаются в Client-Side messagebox

Рис. 11. Сводные данные об ошибках проверки приведены в Client-Side messagebox (Щелкните, чтобы просмотреть полноразмерное изображение)

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

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

Добавьте RequiredFieldValidator в ProductNameInsertItemTemplate. Присвойте ControlToValidate свойству ID значение свойства TextBox в шаблоне, а Text свойству — значение "*", а свойству ErrorMessage — значение "Необходимо указать имя продукта".

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

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

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

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

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

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

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

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

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

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

Присвойте свойству DetailsView CommandField's ValidationGroup значение InsertValidationControls.

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

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

Поля шаблонов DetailsView и CommandField

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

CommandField и TemplateField элемента 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 более подходящим веб-элементом управления. В следующем руководстве мы посмотрим, как заменить элемент управления TextBox элементом управления DropDownList с привязкой к данным, который идеально подходит при редактировании внешнего ключа (например, CategoryID или SupplierID в Products таблице).

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

Об авторе

Скотт Митчелл (Scott Mitchell), автор семи книг ASP/ASP.NET и основатель 4GuysFromRolla.com, работает с Веб-технологиями Майкрософт с 1998 года. Скотт работает независимым консультантом, тренером и писателем. Его последняя книга Sams Teach Yourself ASP.NET 2.0 в 24 часа. Он может быть доступен в mitchell@4GuysFromRolla.com. или через его блог, который можно найти по адресу http://ScottOnWriting.NET.

Особая благодарность

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

НазадВперед