Фильтрация основных и подробных данных с помощью элемента управления DropDownList и GridView (VB)
В этом руководстве показано, как отобразить записи master в элементе управления DropDownList и сведения о выбранном элементе списка в GridView.
Введение
Распространенным типом отчета является отчет master/подробный отчет, в котором отчет начинается с отображения некоторого набора записей "master". Затем пользователь может детализировать одну из записей master, просматривая таким образом сведения master записи. Отчеты с основными и подробными данными — это идеальный вариант для визуализации связей "один ко многим", например отчет со всеми категориями, а затем позволяет пользователю выбрать определенную категорию и отобразить связанные с ней продукты. Кроме того, master/подробные отчеты полезны для отображения подробных сведений из особенно "широких" таблиц (которые содержат много столбцов). Например, уровень "master" отчета master/детализации может отображать только название продукта и цену за единицу продуктов в базе данных, а детализация на конкретный продукт — дополнительные поля продукта (категория, поставщик, количество на единицу и т. д.).
Существует множество способов реализации master/подробных отчетов. В рамках этого и трех следующих учебников мы рассмотрим различные master/подробные отчеты. В этом руководстве показано, как отобразить записи master в элементе управления DropDownList и сведения о выбранном элементе списка в GridView. В частности, в отчете master/подробном руководстве будут перечислены сведения о категории и продукте.
Шаг 1. Отображение категорий в раскрывающемся списке
В нашем master/подробном отчете будут перечислены категории в Раскрывающемся списке, а продукты выбранного элемента списка отображаются далее вниз на странице в GridView. Поэтому перед нами стоит задача, чтобы категории отображались в Раскрывающемся списке. Откройте страницу FilterByDropDownList.aspx
в папке Filtering
, перетащите DropDownList с панели элементов в конструктор страницы и задайте для его ID
свойства значение Categories
. Затем щелкните ссылку Выбрать источник данных в смарт-теге DropDownList. Откроется мастер настройки источника данных.
Рис. 1. Указание источника данных Раскрывающегося списка (щелкните, чтобы просмотреть полноразмерное изображение)
Выберите добавление нового объекта ObjectDataSource с именем CategoriesDataSource
, который вызывает CategoriesBLL
метод класса GetCategories()
.
Рис. 2. Добавление нового объекта ObjectDataSource с именем CategoriesDataSource
(щелкните для просмотра полноразмерного изображения)
Рис. 3. Выбор использования CategoriesBLL
класса (щелкните для просмотра полноразмерного изображения)
Рис. 4. Настройка ObjectDataSource для использования GetCategories()
метода (щелкните для просмотра полноразмерного изображения)
После настройки ObjectDataSource по-прежнему необходимо указать, какое поле источника данных должно отображаться в DropDownList, а какое должно быть связано в качестве значения для элемента списка. Укажите поле в CategoryName
качестве отображаемого и CategoryID
в качестве значения для каждого элемента списка.
Рис. 5. Отображение поля в раскрывающемся списке CategoryName
и использование CategoryID
в качестве значения (щелкните для просмотра полноразмерного изображения)
На этом этапе у нас есть элемент управления DropDownList, который заполняется записями из Categories
таблицы (все это выполняется примерно за шесть секунд). На рисунке 6 показан прогресс, достигнутый на данный момент при просмотре через браузер.
Рис. 6. Drop-Down Списки текущих категорий (щелкните для просмотра полноразмерного изображения)
Шаг 2. Добавление элемента Products GridView
Последний шаг в нашем master/подробном отчете — перечисление продуктов, связанных с выбранной категорией. Для этого добавьте GridView на страницу и создайте объект ObjectDataSource с именем productsDataSource
. productsDataSource
Чтобы элемент управления выверял свои данные из ProductsBLL
метода классаGetProductsByCategoryID(categoryID)
.
Рис. 7. Выбор GetProductsByCategoryID(categoryID)
метода (щелкните для просмотра полноразмерного изображения)
После выбора этого метода мастер ObjectDataSource запрашивает значение параметра метода categoryID
. Чтобы использовать значение выбранного categories
элемента DropDownList, задайте для параметра источник значение Control, а для ControlID — значение Categories
.
Рис. 8. Задайте categoryID
для параметра значение Categories
раскрывающегося списка (щелкните для просмотра полноразмерного изображения)
На минутку проверка ход выполнения в браузере. При первом посещении страницы эти продукты относятся к выбранной категории (Напитки) отображаются (как показано на рис. 9), но изменение DropDownList не обновляет данные. Это связано с тем, что для обновления GridView необходимо выполнить обратную передачу. Для этого у нас есть два варианта (ни один из которых не требует написания кода):
- Задайте для свойства AutoPostBackdropDownList категории значение True. (Это можно сделать, установив флажок Включить AutoPostBack в смарт-теге DropDownList.) Это активирует обратную передачу при каждом изменении пользователем выбранного элемента DropDownList. Таким образом, когда пользователь выбирает новую категорию из Раскрывающегося списка, будет выполнена обратная связь, и GridView будет обновлен с продуктами для только что выбранной категории. (Это подход, который я использовал в этом руководстве.)
- Добавьте веб-элемент управления Кнопка рядом с Раскрывающимся списком. Задайте для его
Text
свойства значение Refresh или что-то подобное. При таком подходе пользователю потребуется выбрать новую категорию и нажать кнопку . Нажатие кнопки приведет к обратной отправке и обновлению GridView, чтобы получить список продуктов выбранной категории.
На рисунках 9 и 10 показан отчет master/подробностей в действии.
Рис. 9. При первом посещении страницы отображаются продукты для напитков (щелкните для просмотра полноразмерного изображения)
Рис. 10. Выбор нового продукта (производство) автоматически вызывает обратную передачу, обновление GridView (щелкните, чтобы просмотреть полноразмерное изображение)
Добавление элемента списка "-- Выбор категории"-"
При первом посещении FilterByDropDownList.aspx
страницы первый элемент списка DropDownList (Напитки) выбирается по умолчанию, отображая продукты напитков в GridView. Вместо того, чтобы отображать продукты первой категории, мы, возможно, захотите выбрать элемент DropDownList, который содержит примерно следующее: "-- Выберите категорию --".
Чтобы добавить новый элемент списка в DropDownList, перейдите к окно свойств и щелкните многоточие в свойстве Items
. Добавьте новый элемент списка с Text
"-- Выберите категорию --" и Value
-1
.
Рис. 11. Добавление - Выбор категории - Элемент списка (щелкните для просмотра полноразмерного изображения)
Кроме того, можно добавить элемент списка, добавив следующую разметку в DropDownList:
<asp:DropDownList ID="categories" runat="server"
AutoPostBack="True" DataSourceID="categoriesDataSource"
DataTextField="CategoryName" DataValueField="CategoryID"
EnableViewState="False">
<asp:ListItem Value="-1">
-- Choose a Category --
</asp:ListItem>
</asp:DropDownList>
Кроме того, необходимо задать для элемента управления AppendDataBoundItems
DropDownList значение True, так как если категории привязаны к DropDownList из ObjectDataSource, они будут перезаписывать все элементы списка, добавленные вручную, если AppendDataBoundItems
значение не равно True.
Рис. 12. Присвойте свойству AppendDataBoundItems
значение True
После этих изменений при первом посещении страницы выбирается параметр "-- Выбрать категорию --", и продукты не отображаются.
Рис. 13. На начальной странице загрузки продукты не отображаются (щелкните для просмотра полноразмерного изображения)
Причина, по которой продукты не отображаются, если выбран элемент списка "-- Выбрать категорию --", заключается в том, что его значение равно -1
, а в базе данных нет продуктов с CategoryID
.-1
Если это нужное поведение, то на этом этапе все готово! Если же вы хотите отобразить все категории при выборе элемента списка "-- Выбрать категорию --", вернитесь к классу ProductsBLL
и настройте GetProductsByCategoryID(categoryID)
метод таким образом, чтобы он вызвал GetProducts()
метод , если переданный categoryID
параметр меньше нуля:
Public Function GetProductsByCategoryID(categoryID As Integer) _
As Northwind.ProductsDataTable
If categoryID < 0 Then
Return GetProducts()
Else
Return Adapter.GetProductsByCategoryID(categoryID)
End If
End Function
Метод, используемый здесь, аналогичен подходу, который мы использовали для отображения всех поставщиков в руководстве по декларативным параметрам , хотя в этом примере мы используем значение -1
, чтобы указать, что все записи должны быть извлечены, а не Nothing
. Это связано с тем, что categoryID
параметр GetProductsByCategoryID(categoryID)
метода ожидает передачи целочисленного значения, в то время как в учебнике По декларативным параметрам мы передавали строковый входной параметр.
На рисунке 14 показан снимок FilterByDropDownList.aspx
экрана с выбранным параметром "-- Выбрать категорию --". Здесь все продукты отображаются по умолчанию, и пользователь может сузить дисплей, выбрав определенную категорию.
Рис. 14. Все продукты теперь перечислены по умолчанию (щелкните для просмотра полноразмерного изображения)
Сводка
При отображении иерархически связанных данных часто бывает полезно представить данные с помощью master/подробных отчетов, из которых пользователь может начать просматривать данные из верхней части иерархии и детализировать их. В этом руководстве мы рассмотрели создание простого master/подробного отчета с продуктами выбранной категории. Для этого используется DropDownList для списка категорий и GridView для продуктов, принадлежащих к выбранной категории.
В следующем руководстве мы рассмотрим интерфейс DropDownList на один шаг вперед, используя два DropDownList.
Счастливое программирование!
Об авторе
Скотт Митчелл (Scott Mitchell), автор семи книг ASP/ASP.NET и основатель 4GuysFromRolla.com, работает с Веб-технологиями Майкрософт с 1998 года. Скотт работает независимым консультантом, тренером и писателем. Его последняя книга Sams Teach Yourself ASP.NET 2.0 в 24 часа. Его можно связать по адресу mitchell@4GuysFromRolla.com. или через его блог, который можно найти по адресу http://ScottOnWriting.NET.
Обратная связь
https://aka.ms/ContentUserFeedback.
Ожидается в ближайшее время: в течение 2024 года мы постепенно откажемся от GitHub Issues как механизма обратной связи для контента и заменим его новой системой обратной связи. Дополнительные сведения см. в разделеОтправить и просмотреть отзыв по