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

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

В этом пошаговом руководстве рассматриваются следующие задачи:

• Использование элемента управления ListView для отображения данных из базы данных.

• Добавление функции разбиения по страницам в элемент управления ListView.

• Добавление функции сортировки в элемент управления ListView.

Создание веб-узла на базе файловой системы

1. Откройте Visual Studio 2008 или Visual Web Developer 2008, экспресс-выпуск.

2. В меню Файл выберите пункт Создать и нажмите кнопку Веб-узел. При использовании Visual Web Developer, экспресс-выпуск в меню Файл выберите команду Создать веб-узел.

Откроется диалоговое окно Создать веб-узел.

3. В группе Установленные шаблоны Visual Studio выберите Веб-узел ASP.NET.

4. В поле Расположение выберите пункт Файловая система, а во второе поле введите имя папки, в которой будут храниться страницы веб-узла.

Например, введите имя папки D:\MN41\Lab5.

5. В списке Язык выберите язык программирования, с которым вы предпочитаете работать(VB).

6. Нажмите кнопку ОК.

Visual Studio создаст папку и новую страницу с именем Default.aspx.

Отображение данных и разбивка их на страницы в элементе управления ListView

1. У папку із створеним веб-вузлом скопіювати (або створити у ній) базу даних Access з попередньої лабораторної роботи. Під’єднати створену базу даних до веб-вузла. Для цього у Visual Web Developer, у вікні Обозреватель решений клацнути правою клавішею мишки на імені веб-вузла. З контекстного меню вибрати пункт Существующий элемент. У вікні, що відкриється, вибрати файл створеної бази даних та натиснути клавішу Добавить.

2. Перейдите к файлу Default.aspx или откройте его.

3. Перейдите в режим Конструктора.

4. С вкладки Данные панели элементов перетащите элемент управления ListView на страницу.

5. В меню Задачи ListView выберите в раскрывающемся списке Выбрать источник данных команду <Новый источник данных…>.

Появится мастер настройки источника данных.

6. Нажмите кнопку База данных Access.

7. В поле Укажите идентификатор источника данных отображается имя элемента управления источником данных по умолчанию, AccessDataSource1. Можно оставить это имя.

8. Нажмите кнопку ОК.

З’явиться майстер налаштування джерела даних.

У наступному вікні

Клацнути на клавіші Обзор. Вибрати файл бази даних.

9. Клацнути на клавіші ОК. Клацнути на клавіші Далее.

10. У наступному вікні вибрати всі поля, крім поля Фотографія.

Нажмите кнопку Далее.

11. У наступному вікні Пробный запрос можна клацнути на клавіші Пробный запрос і переглянути результат. Натиснути клавішу Готово.

Мастер создает элемент управления AccessDataSource и добавляет его на страницу. Элемент управления ListView, который был добавлен ранее, связывается с элементом управления AccessDataSource.

12. Щелкните правой кнопкой мыши элемент управления ListView и выберите команду Показать смарт-тег.

13. В меню Общие задачи ListView выберите команду Настроить ListView.

Появится диалоговое окно Настроить ListView.

14. В групі Выбрать макет вибрати Сетка, групі Выбрать стиль вибрати наприклад, цветной, в групі Параметри поставити позначку Разрешить страничный і з випадаючого списку вибрати один з варіантів. Натиснути клавішу ОК.

15. Одержимо:

Прежде чем продолжить, можно протестировать элемент управления ListView.

Тестирование элемента управления ListView

1. Нажмите сочетание клавиш CTRL + F5 для запуска страницы або на палітрі інструментів клацнути на клавіші -- Просмотр в обозревателе.

2. Используйте кнопки Первая, Предыдущая, Следующая и Последняя внизу страницы, чтобы постранично просматривать данные.

3. После окончания закройте обозреватель.

Добавление функции сортировки в элемент управления ListView

Далее функция сортировки будет добавлена в элемент управления ListView. Эту функцию можно предоставить, добавив в элемент управления ListView кнопку и настроив ее.

(не працює)

Чтобы добавить функцию сортировки в элемент управления ListView:

1. В файле Default.aspx щелкните правой кнопкой мыши элемент управления ListView и выберите команду Показать смарт-тег.

2. В списке Текущее представление меню Общие задачи ListView выберите представление для редактирования шаблона LayoutTemplate, например ItemTemplate.

   Примечание.

   Не существует особого представления для редактирования шаблона LayoutTemplate. Можно редактировать шаблон в любом представлении из списка Текущее представление, за исключением представления во время выполнения и EmptyDataTemplate.

3. Перетащите из вкладки Стандартные панели элементов два элемента управления Button вниз элемента управления, в котором располагаются элементы управления для разбиения по страницам.

4. В окне Свойства измените свойства кнопок следующим образом.

• Для первой кнопки установите свойство Text в значение "Сортировать по имени", свойство CommandName — в значение "Sort", а свойство CommandArgument — в значение "FirstName".

• Для второй кнопки установите свойство Text в значение "Сортировать по фамилии", свойство CommandName — в значение "Sort", а свойство CommandArgument — в значение "LastName"".

Свойства CommandArgument кнопки устанавливаются в значение выражения сортировки. Для данных базы данных им, как правило, является имя столбца.

5. Сохраните страницу.

Теперь можно протестировать страницу снова.

Чтобы протестировать сортировку:

1. Нажмите сочетание клавиш CTRL + F5 для запуска страницы.

2. Нажмите кнопки Сортировать по имени и Сортировать по фамилии, чтобы отсортировать данные различными способами.

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