Опубликован: 05.08.2010 | Доступ: платный | Студентов: 285 / 0 | Оценка: 4.12 / 4.02 | Длительность: 10:07:00
Лекция 12:

Отображение содержимого XML-документов

Аннотация: Будут рассмотрены способы отображения содержимого XML-файлов с помощью элементов управления Xml, GridView и TreeView. Будет продемонстрирована возможность применения сразу двух XSLT-таблиц к одному XML-файлу.

Презентацию к данной лекции Вы можете скачать здесь.

Отображение данных с помощью элемента управления Xml

Рассмотрим, каким образом можно отобразить содержимое XML-документа на web-странице с помощью серверного элемента управления ASP.NET Xml и преобразования XSLT.

Чтобы отобразить сведения из XML-файла на web-странице, необходимо предоставить сведения о форматировании и отображении. Кроме того, необходимо предоставить инструкции относительно размещения данных из XML-файла. Например, можно отобразить каждый элемент из XML-файла в виде одной строки таблицы.

Для этих целей обычно используется язык XSL-преобразований для создания XSL-файлов. XSL-преобразования содержат следующие сведения.

  • Шаблон, аналогичный HTML-странице. Данный шаблон указывает способ отображения информации из XML-файла.
  • Инструкции XSL-преобразования, предоставляющие точную информацию о том, как сведения из XML-файла должны размещаться в шаблоне.

Можно определить несколько преобразований и затем применить их к одному и тому же XML-файлу.

После создания XSL-преобразований необходимо применить их к XML-файлу. При этом XML-файл обрабатывается путем его преобразования в соответствии с одним из XSL-файлов.

Этот процесс лучше делать с помощью серверного элемента управления Xml, выполняющего роль "местозаполнителя" на ASP.NET-странице. Можно указать в его свойствах определенный XML-файл и XSL-преобразование. При обработке страницы элемент управления выполняет чтение XML-файла, применяет преобразование и отображает результат.

Предположим, у нас есть xml-файл, в котором содержатся сведения о товарах. Нам нужно иметь возможность отображать как все данные целиком, так и лишь заголовки. Для этого мы создадим два файлы XLS-преобразования, один XML-файл и одну ASP.NET- страницу [1].

Запускаем Visual Web Developer. Создаем XML-файл и сохраняем его в папке App_Data.

<?xml version="1.0" encoding="windows-1251" ?>
<Products>
  <Product id="101">
    <ProductName>Sharp LC-32 LE600 RU</ProductName>
    <Price>38990 руб.</Price>
    <Manufacturer>Польша</Manufacturer>
    <Warranty>3 года</Warranty>
    <Description>
      Серия ЖК телевизоров c оригинальной "шарповской" Full HD панелью 10-го поколения и светодиодной подсветкой Full LED.
    </Description>
  </Product>
  <Product id="109">
    <ProductName>Samsung UE-32 B6000</ProductName>
    <Price>39900 руб.</Price>
    <Manufacturer>Россия</Manufacturer>
    <Warranty>2 года</Warranty>
    <Description>
      Элегантный Samsung UE-32 B6000, оснащенный технологией устранения бликов Ultra Clear Panel, поможет вам 
      превратить свою гостиную в уютный кинозал. Благодаря использованию светодиодов (LED) для подсветки 
      вместо обычных люминесцентных ламп толщина этого телевизора составляет всего 3 см.
    </Description>
  </Product>
  <Product id="123">
    <ProductName>Philips 42PFL9803H/10</ProductName>
    <Price>99900 руб.</Price>
    <Manufacturer>Бельгия</Manufacturer>
    <Warranty>1 год</Warranty>
    <Description>
      Погрузитесь в мир незабываемых впечатлений с 42-дюймовым широкоформатным телевизором Philips 42PFL9803H/10. 
      Новая технология Ambilight Spectra 2, которая используется в нем, добавит яркости и четкости изображению, 
      а LED Lux передаст всю цветовую гамму изображения максимально естественно.
    </Description>
  </Product>
</Products>

Теперь добавим в проект два XSL-преобразования: , с помощью которого на экран будут выводиться все данные и (выводит только заголовки). Оба файла нужно сохранить в папке App_Data.

<?xml version='1.0'?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    version="1.0">
  <xsl:template match="/">
    <html>
      <body>
        <table cellspacing="10" cellpadding="4">
          <xsl:for-each select="Products/Product">
            <tr bgcolor="#CCCCCC">
              <td class="info">
                Название товара: <strong>
                  <xsl:value-of select="ProductName"/>
                </strong>
                <br /><br />
                Цена: <strong>
                  <xsl:value-of select="Price"/>
                </strong>
                <br /><br />
                Страна-производитель: <strong>
                  <xsl:value-of select="Manufacturer"/>
                </strong>
                <br /><br />
                Гарантия: <strong>
                  <xsl:value-of select="Warranty"/>
                </strong>
                <br /><br />
                <br /><br />
                <xsl:value-of select="Description"/>
              </td>
            </tr>
          </xsl:for-each>
        </table>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>
<?xml version='1.0'?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    version="1.0">
  <xsl:template match="/">
    <html>
      <body>
        <table cellspacing="3" cellpadding="8">
          <tr bgcolor="#AAAAAA">
            <td class="heading">
              <strong>Название товара</strong>
            </td>
            <td class="heading">
              <strong>Цена</strong>
            </td>
            <td class="heading">
              <strong>Страна-производитель</strong>
            </td>
          </tr>
          <xsl:for-each select="Products/Product">
            <tr bgcolor="#DDDDDD">
              <td width="25%" valign="top">
                <xsl:value-of select="ProductName"/>
              </td>
              <td width="20%" valign="top">
                <xsl:value-of select="Price"/>
              </td>
              <td width="55%" valign="top">
                <strong>
                  <xsl:value-of select="Manufacturer"/>
                </strong>
              </td>
            </tr>
          </xsl:for-each>
        </table>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>

Добавим к проекту ASP.NET-страницу. Из панели инструментов перетащим элемент управления Xml и настроим его таким образом, чтобы свойство DocumentSource стало равно "~/Products.xml", а свойство TransformSource стало равно "~/App_Data/Products_headers.xslt".

Дале, нам нужно разместить элемент управления CheckBox выше элемента управления Xml. У элемента управления CheckBox свойство Text нужно сделать равным "Только заголовки", Свойство checked - True, AutoPostBack - тоже True. Дважды щелкнем по элементу управления Checkbox и введем в обработчике событий следующий код:

If CheckBox1.Checked Then
    Xml1.TransformSource = "~/App_Data/Products_headers.xslt"
Else
    Xml1.TransformSource = "~/App_Data/Products_all.xslt"
End If

Запустив проект, мы получим следующий результат:

Отображение только заголовков

увеличить изображение
Рис. 15.1. Отображение только заголовков
Отображение всей информации

увеличить изображение
Рис. 15.2. Отображение всей информации