3. Используйте компонент Повторитель для отображения набора данных.
Связанное введение
Существуют различные способы отображения данных в ASP.NET, среди которых еще один существующий компонент — Repeater. DataGrid всегда будет отображать данные в «таблице». Когда мы хотим отображать данные более свободным способом, мы обязательно будем использовать элемент управления «Повторитель».
Он определяет формат вывода данных в виде шаблона.
ШАГ 1. Создайте страницу. Мы можем создать компонент Повторитель для отображения данных, изменив исходную страницу. Переименуйте Location1.htm в Location1.aspx. Удалите исходную часть страницы и создайте набор данных, как в предыдущей главе, фильтруя Region_IDEnterValue=1. Давайте воспользуемся элементом управления «Повторитель» для создания динамических страниц.
jЧтобы использовать шаблоны для определения формата вывода, сначала создайте таблицу. Мы можем увидеть это на странице ApplicationàDatabases.
Структура базы данных.
[Рис. 3-1 Структура базы данных]
На основе структуры базы данных разработайте следующие таблицы.
[Рисунок 3-2 Схема шаблона]
kДанные необходимо привязать к таблице ниже. Перетащите элемент данных из «Привязки» на панели «Приложение» на его место.
[Рис. 3-3. Диалоговое окно «Привязка»]
После привязки данных вы получите следующую страницу:
[Рисунок 3-4. Страница после привязки данных]
Это немного похоже на дежавю, поскольку Dreamwaver MX продолжает традицию UltraDev по выделению данных. ③ Форму представления данных также можно выбрать в диалоговом окне «Привязка». После щелчка по элементу данных на странице можно выбрать форму представления данных для соответствующих данных в привязке.
[Рисунок 3-5 Форма представления данных]
Если вы хотите использовать эту таблицу в качестве шаблона для отображения всех элементов данных, вам необходимо выбрать всю эту таблицу. Нажмите «+» в пункте «Поведение сервера» на панели «Приложение» и выберите пункт «Повторить регион».
[Рис. 3-6. Выбор региона повтора] [Рис. 3-7. Выбор метода повтора]
Определите метод, который вы хотите повторить, в разделе «Повторить регион» и нажмите «ОК». Теперь вы можете нажать «F12», чтобы просмотреть страницу.
ШАГ 2. Проанализируйте код (Примечание: для отображения кода все следующие коды имеют пробелы после «<» и перед «>». Приносим извинения за неудобства!)
< ASP:Repeater runat="server" DataSource='< %# DataSet1.DefaultView % >' >
<Шаблон элемента>
< ширина таблицы="75%" border="0" >
<тр>
< td width="18%" >Название местоположения</td >
< td colspan="3" > < %# DataSet1.FieldValue("LOCATION_NAME", Container) % > </ /td >
</tr >
<тр>
< td >Город</td >
< td width="35%" > < %# DataSet1.FieldValue("CITY", Container) % > </ /td >
< td width="19%" >Адрес</td >
< td width="28%" > < %# DataSet1.FieldValue("ADDRESS", Container) % > </ /td >
</tr >
<тр>
< td >Состояние</ /td >
< td > < %# DataSet1.FieldValue("STATE_COUNTRY", Container) % > </td >
< td >Код</td >
< td > < %# DataSet1.FieldValue("КОД", Контейнер) % > </td >
</tr >
<тр>
< td >Телефон</td >
< td > < %# DataSet1.FieldValue("ТЕЛЕФОН", Контейнер) % > </td >
< td >Факс</td >
< td > < %# DataSet1.FieldValue("ФАКС", Контейнер) % > </td >
</tr >
</таблица>
</ItemTemplate >
</ASP:Репитер>
ASP.net отображает все данные повторно, создавая шаблон ItemTemple, поэтому, если вы хотите установить стиль повторителя, вы можете сделать это, задав шаблон.
Мы также можем добавить другие шаблоны для достижения желаемого эффекта.
AlternatingItemTemplate: реализует данные перекрестного отображения. Данные перекрестного отображения с шаблоном исходного ItemTemplate
SepartorTemplate: шаблон разделителя. Может использоваться для разделения строк данных.
HeaderTemplate: шаблон заголовка. Отображается вверху со всеми данными.
FooterTemplate: шаблон нижнего колонтитула. Показано внизу со всеми данными.
Его форма дизайна такая же, как у ItemTemplate. Просто окружите маркерами ту часть, которую хотите создать шаблон.
Существуют ярлыки для вставки кода через Dreamwaver MX. Откройте вкладку ASP.NET на панели «Вставка», затем нажмите отметки, откроется диалоговое окно добавления отметки. Выберите проект «Шаблоны» в тегах ASP.NET. Затем вы можете выбрать код, который хотите добавить. Dreamwaver MX добавит код в то место, где находился исходный курсор ввода.
[Рис. 2-1. Диалоговое окно «Добавить маркер»]
Ниже приведен код для AlternatingItemTemplate, SepartorTemplate, HeaderTemplate и FooterTemplate, который можно вставить в < ASP:Repeater > < /ASP:Repeater >.
< headertemplate >< font color="#666666" size="4" >Все
Местоположение</font >< /headertemplate >
<Альтернатингитемтемплате>
< table width="75%" border="0" bgcolor="#CCCCCC" >
<тр>
< td width="17%" >Название местоположения</td >
< td colspan="3" bgcolor="#CCCCCC" >
< %# DataSet1.FieldValue("LOCATION_NAME", Container) % >
</ / тд >
</tr >
<тр>
< td >Город</td >
< td width="34%" > < %# DataSet1.FieldValue("CITY", Container) % > </ /td >
< td width="24%" >Адрес</td >
< td width="25%" > < %# DataSet1.FieldValue("ADDRESS", Container) % > </ /td >
</tr >
<тр>
< td >Состояние</ /td >
< td > < %# DataSet1.FieldValue("STATE_COUNTRY", Container) % > </td >
< td >Код</td >
< td > < %# DataSet1.FieldValue("КОД", Контейнер) % > </td >
</tr >
<тр>
< td >Телефон</td >
< td > < %# DataSet1.FieldValue("ТЕЛЕФОН", Контейнер) % > </td >
< td >Факс</td >
< td > < %# DataSet1.FieldValue("ФАКС", Контейнер) % > </td >
</tr >
</таблица>
</AlternatingItemTemplate >
< separatortemplate >< hr width="70%" align="left" >
</separatortemplate >
< footertemplate >< font color="#666666" size="4" >Конец</font >< /footertemplate >
Когда IIS анализирует код, он помещает шаблон в относительное положение на основе ключевых слов и получает первоначально запрошенную страницу.
Страница, созданная вышеуказанной программой, выглядит следующим образом:
[Рис. 2-1. Последняя страница]
Компонент Повторитель может создать более свободную страницу, но каждая строка может отображать только один набор данных. Если вы хотите создать более бесплатную страницу, перейдем к следующему разделу и воспользуемся элементом управления DataList для отображения данных.