DreamwaverMX и ASP.NET(2)

2. Используйте компонент ASP.NET DataGrid для отображения данных.

Введение в связанный контент:

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

1. Связь с базой данных и отображение данных с помощью DataGrid.

База данных global.mdb этого экземпляра находится в ресурсах каталога веб-страницы. Наша цель — вывести данные разных регионов на основе значения Region_id в таблице местоположений в этой базе данных. (Вы можете использовать Access, чтобы открыть эту базу данных)

Мы можем переименовать файл location3.htm в location3.aspx (суффикс файла веб-окна ASP.NET — aspx), а затем отредактировать его.



[Рис. 2-1. Страницы, которые необходимо изменить]

Давайте удалим простую статическую часть посередине и воспользуемся DataGrid ASP.NET для реализации ее функциональности.



[Рис. 2-2. Удаление статической части страницы]
Следующий шаг — подключение к базе данных. Щелкните панель «Приложение» справа, выберите «База данных» и щелкните знак «+».

Выберите соединение OLE DB.



[Рис. 2-3 Панель приложения]

Затем войдите в диалоговое окно «Подключение OLE DB». Здесь вы можете написать код базы данных ссылок вручную или автоматически сгенерировать код. Назовите местоположение «Имя соединения», нажмите «Создать», и код будет автоматически сгенерирован с помощью мастера.



[Рис. 2-4. Диалоговое окно «Подключение OLE DB»]

После входа на страницу «Свойства связи с данными» выберите «Поставщик», чтобы настроить ядро ​​базы данных.

Что удивительно, так это то, что он поддерживает 21 метод подключения к базе данных, включая SQL-сервер, Oracle и т. д.



[Рис. 2-5. Страница, предоставленная ядром базы данных]

Это одна из замечательных особенностей .NET — поддержка нескольких баз данных. Он использует ADO.NET. Через некоторое время строка подключения, которую мы генерируем с помощью этого мастера, записывается в соответствии с ADO.NET.

Поскольку база данных, с которой мы собираемся установить связь, представляет собой базу данных Access2000, мы выбираем поставщика OLE DB Microsoft Jet 4.0 и нажимаем «Далее».

Нажмите кнопку рядом с 1. Выберите или введите имя базы данных, чтобы выбрать базу данных, с которой вы хотите установить связь.

Отмените имя пользователя и пароль в 2. Введите информацию для входа в базу данных.



[Рисунок 2-6. Ссылка на настройку]

Установите права на чтение в разделе «Дополнительно». Выберите «Чтение», «Чтение-запись», «Запись» и нажмите «ОК».



[Рис. 2-7. Настройка разрешений]

Добавьте имя подключения и нажмите «Тест», чтобы проверить связь с базой данных. Если связь с базой данных установлена ​​успешно, нажмите «ОК». поздравления,

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

Также на панели «Приложение» выберите «Поведение сервера».

Сначала выполните настройки, нажмите «Развернуть», и программа автоматически развернет сайт и скопирует в каталог сайта папки DreamweaverCtrls.dll, web.config и _mmServerScripts, которые необходимы для использования Dreamweaver MX для создания веб-страниц ASP.net.



[Рис. 2-8. Место развертывания]
При этом сначала необходимо создать папку bin в корневом каталоге веб-сайта и скопировать в эту папку файл DreamweaverCtrls.dll.

Нажмите знак +, чтобы сначала создать новый набор данных.



[Рис. 2-9. Добавление набора данных]

Соединение — для выбора источника данных, Таблица — для выбора таблицы, Столбец — для выбора элемента, а Фильтр используется для фильтрации данных. Поскольку на этой странице отображаются данные из Европы, установлено Введенное значение = 3. В случае сбоя функция «Перейти» используется для обработки страницы, на которую осуществляется переход в случае ошибки при чтении данных.



[Рис. 2-10 Создание набора данных]

После успешного создания DataSet вы можете создать DataGrid. Нажмите знак + и выберите DataGrid.



[Рис. 2-11. Добавление DataGrid]

Выберите необходимый набор записей в «Наборе данных», укажите, следует ли использовать постраничное отображение и количество записей на странице, отображаемых в разбивке по страницам, установите метод панели навигации в «Навигации», а также добавьте или удалите отображаемые элементы в «Столбцах».



[Рис. 2-12 Настройка DataGrid]

Нажмите «Изменить», чтобы установить заголовок заголовка. После ввода названия нажмите «ОК» для подтверждения.



[Рисунок 2-13 Название настройки]

Нажмите кнопку ОК, чтобы добавить DataGrid.



[Рис. 2-14 Страница предварительного просмотра]

На странице предварительного просмотра вы можете увидеть область, в которую был добавлен DataGrid. Нажмите F12, чтобы просмотреть страницу.

Ниже страница после запуска.



[Рис. 2-15. Страница после запуска]
2.Измените свойства DataGrid.

Введение в связанный контент:

Когда вы видите этот компонент, вам кажется, что цвет выглядит не слишком красиво? Тогда давайте его изменим. Компонент DataGrid имеет множество свойств, с помощью которых можно изменить стиль DataGrid.

Анализ кода