Фильтрация основных и подробных данных с помощью элемента управления DropDownList и GridView (C#)

Статья
07/13/2023

В этом руководстве мы покажем, как отобразить записи master в элементе управления DropDownList и сведения о выбранном элементе списка в GridView.

Введение

Распространенным типом отчета является отчет master/подробностей, в котором отчет начинается с отображения набора записей "master". Затем пользователь может детализировать одну из master записей, тем самым просмотрев сведения об этой master записи. Отчеты master/detail идеально подходят для визуализации связей "один ко многим", например отчета со всеми категориями, а затем позволяют пользователю выбрать определенную категорию и отобразить связанные с ней продукты. Кроме того, master/подробные отчеты полезны для отображения подробных сведений из особенно "широких" таблиц (которые содержат большое количество столбцов). Например, уровень "master" отчета master/подробностей может отображать только название продукта и цену за единицу товара в базе данных, а детализация на определенный продукт будет отображать дополнительные поля продукта (категория, поставщик, количество на единицу и т. д.).

Существует множество способов реализации master/подробных отчетов. В этом и трех следующих руководствах мы рассмотрим различные master/подробные отчеты. В этом руководстве описано, как отобразить записи master в элементе управления DropDownList и сведения о выбранном элементе списка в GridView. В частности, в отчете master/подробных сведений этого учебника будут перечислены категории и сведения о продукте.

Шаг 1. Отображение категорий в раскрывающемся списке

В нашем отчете master/подробных сведений будут перечислены категории в Раскрывающемся списке, а продукты выбранного элемента списка отображаются далее вниз на странице GridView. Первая задача, поставленная перед нами, заключается в том, чтобы категории отображались в Раскрывающемся списке. Откройте страницу FilterByDropDownList.aspx в папке Filtering , перетащите раскрывающийся список из панели элементов в конструктор страницы и задайте для его ID свойства значение Categories. Затем щелкните ссылку Выбрать источник данных в смарт-теге DropDownList. Откроется мастер настройки источника данных.

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

Выберите , чтобы добавить новый объект ObjectDataSource с именем CategoriesDataSource , который вызывает CategoriesBLL метод класса GetCategories() .

Рис. 2. Добавление нового объекта ObjectDataSource с именем CategoriesDataSource (щелкните для просмотра полноразмерного изображения)

Рис. 3. Выбор использования CategoriesBLL класса (щелкните для просмотра полноразмерного изображения)

Рис. 4. Настройка ObjectDataSource для использования GetCategories() метода (щелкните для просмотра полноразмерного изображения)

После настройки ObjectDataSource по-прежнему необходимо указать, какое поле источника данных должно отображаться в Раскрывающемся списке и какое из них должно быть связано в качестве значения для элемента списка. Укажите поле в 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 необходимо выполнить обратную передачу. Для этого у нас есть два варианта (ни один из которых не требует написания кода):

Задайте для свойства AutoPostBack для категорий DropDownList значение True. (Это можно сделать, установив флажок Включить AutoPostBack в смарт-теге DropDownList.) Это активирует обратную передачу всякий раз, когда пользователь изменяет выбранный элемент DropDownList. Таким образом, когда пользователь выбирает новую категорию в раскрывающемся списке, происходит обратная связь, и GridView будет обновлен с продуктами для только что выбранной категории. (Это подход, который я использовал в этом руководстве.)
Добавьте веб-элемент управления Кнопка рядом с раскрывающимся списком. Присвойте свойству Text значение Refresh или что-то подобное. При таком подходе пользователю потребуется выбрать новую категорию и нажать кнопку . Нажатие кнопки приведет к обратной отправке и обновлению GridView, чтобы получить список продуктов выбранной категории.

На рисунках 9 и 10 показан отчет о master/подробных данных в действии.

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

Рис. 10. Выбор нового продукта (product) автоматически вызывает обратную передачу, обновление 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.

Присвойте свойству AppendDataBoundItems значение True.

Рис. 12. Установка для AppendDataBoundItems свойства значения True

После этих изменений при первом посещении страницы выбирается параметр "-- Выбрать категорию --", и продукты не отображаются.

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

Причина, по которой продукты не отображаются при выборе элемента списка "-- Выбрать категорию --", заключается в том, что его значение равно -1 , а в базе данных нет продуктов с -1CategoryID . Если вы хотите это поведение, то на этом этапе все готово! Если, однако, вы хотите отобразить все категории при выборе элемента списка "-- Выбрать категорию --", вернитесь к классу ProductsBLL и настройте GetProductsByCategoryID(categoryID) метод таким образом, чтобы он вызвал GetProducts() метод, если переданный categoryID параметр меньше нуля:

public Northwind.ProductsDataTable GetProductsByCategoryID(int categoryID)
{
    if (categoryID < 0)
        return GetProducts();
    else
        return Adapter.GetProductsByCategoryID(categoryID);
}

Метод, используемый здесь, аналогичен подходу, который мы использовали для отображения всех поставщиков в руководстве по декларативным параметрам , хотя в этом примере мы используем значение -1 , чтобы указать, что все записи должны быть извлечены, а не null. Это связано с тем, что 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.

Вперед