XSLT – Como gerar uma página HTML com as informações do XML

 

Introdução

Hoje estaremos aprendendo como gerar os componentes HTML(table e select) com informações capturadas de um arquivo XML. E para conseguirmos realizar essa transformação vamos usar a tecnologia XSLT, e a classe XslCompiledTransform da plataforma .NET. Então vamos botar a mão na massa.

 

Arquivo XML

Primeiro vamos criar um arquivo XML (nome arquivoXML.xml) com o código da Listagem 01 que tem algumas informação, no nosso caso gêneros de filmes.

 

Estamos criando um arquivo XML manualmente para não precisarmos acessar um banco de dados, e realizar uma consulta SQL e depois sim gerar o XML com o resultado da consulta SQL.

 

<?xml version="1.0" encoding="iso-8859-1"?>

<Generos>

      <Genero>

            <id_genero>1</id_genero>

            <descricao>Ação</descricao>

      </Genero>

      <Genero>

            <id_genero>6</id_genero>

            <descricao>Aventura</descricao>

      </Genero>

      <Genero>

            <id_genero>5</id_genero>

            <descricao>Comédia</descricao>

      </Genero>

      <Genero>

            <id_genero>2</id_genero>

            <descricao>Drama</descricao>

      </Genero>

</Generos>

Listagem 01. Arquivo XML com alguns gêneros de filmes.

 

No código da Listagem 01 temos uma simples estrutura de elementos XML. E é através desta estrutura que vamos capturar os gêneros como o arquivo XSLT.

 

 

Arquivo XSLT

Para conseguirmos apresentar as informações contida no arquivo XML, vai ser preciso criar um arquivo XSLT (nome arquivoXSL.xsl) mostrado na Listagem 02.

 

E através deste arquivo vamos gerar um página HTML com dois componentes(table e select) com os gêneros do arquivo XML.

 

<?xml version="1.0" encoding="iso-8859-1"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

 

<xsl:template match="/">

<html>

      <body>

                       

            <table border="1">

                  <tr bgcolor="gray">

                        <th align="left">Código</th>

                        <th align="left">Descrição</th>

                  </tr>

                  <xsl:for-each select="Generos/Genero">

                        <tr>

                             <td>

                                   <xsl:value-of select="id_genero"/>

                             </td>

                             <td>

                                   <xsl:value-of select="descricao"/>

                             </td>

                        </tr>

                  </xsl:for-each>

            </table>

                       

            <br/>

            <br/>

                       

            <select id="selectGeneros">

                  <xsl:for-each select="Generos/Genero">

                        <option>

                              <xsl:value-of select="descricao"/>

                        </option>

                  </xsl:for-each>

            </select>

                       

      </body>

</html>

</xsl:template>

</xsl:stylesheet>

Listagem 02. Arquivo XSLT responsável em gerar a página HTML com as informações do arquivo XML.

 

Para identificar o arquivo como sendo XSLT é definido o elemento raiz <xsl:stylesheet>. Perceba que criamos uma TABLE e um SELECT HTML, e juntamento com esses dois componentes temos os elementos <xsl:for-each> e <xsl:value-of> do XSLT. Sendo o primeiro responsavel em pegar os gêneros no arquivo XML e realizar o loop no arquivo XSLT, e o segundo é responsável em capturar os valores dentro do loop.

 

Na Listagem 03 é mostrado o resultado do arquivo XSLT.

 

<html>

  <body>

    <table border="1">

      <tr bgcolor="gray">

        <th align="left">Código</th>

        <th align="left">Descrição</th>

      </tr>

      <tr>

        <td>1</td>

        <td>Ação</td>

      </tr>

      <tr>

        <td>6</td>

        <td>Aventura</td>

      </tr>

      <tr>

        <td>5</td>

        <td>Comédia</td>

      </tr>

      <tr>

        <td>2</td>

        <td>Drama</td>

      </tr>

     </table>

<br><br>

<select id="selectGeneros">

<option>Ação</option>

            <option>Aventura</option>

            <option>Comédia</option>

            <option>Drama</option>

</select></body>

</html>

Listagem 03. Resultado do arquivo XSLT.

 

Página Genero.aspx

Vamos desenvolver o que será a responsável em executar tudo o que foi feito anteriormente, ou seja, arquivo XML e XSLT.

 

Criando uma página com o nome Genero.aspx, e deixando a página como na Listagem 04. Já que vamos gerar o HTML com XSLT não vamos precisar do HTML da página Gênero.aspx. Deixando apenas a tag <%@ Page %> para criar o link com o arquivos Genero.aspx.cs onde esta a classe Genero.

 

<%@Page Language="C#" AutoEventWireup="true" CodeFile="Genero.aspx.cs" Inherits="Genero" %>

Listagem 04. Arquivo Gênero.aspx.

 

Vamos fazer agora o código da listagem Listagem 05 no método Page_Load da página para realizar a transformação de uma página HTML através do arquivo XSLT, sobre os elementos contido no arquivo XML.

 

using System.Xml.Xsl; // XslCompiledTransform

using System.IO;      // StringWriter

.

.

StringWriter htmlGerado = new StringWriter();

XslCompiledTransform xslt = new XslCompiledTransform();

xslt.Load(Server.MapPath("~/arquivoXSL.xsl"));

xslt.Transform(Server.MapPath("~/arquivoXML.xml"), null, htmlGerado);

Response.Write(htmlGerado);

Listagem 05. Código do método Page_Load.

 

Primeiro chamamos o método Load() com objeto da classe XslCompiledTransform e passando por parâmentro o arquivo XSLT, falando que é através deste arquivos que vai ocorrer a transformação. Em seguida é chamado o método Transform() sendo o primeiro parâmentro a arquivo XML, no segundo tem a possíbilidade de passar parâmentro, e no último é um objeto da classe StringWriter para onde será enviado o HTML gerado(Listagem 03).

 

E no fim enviamos o objeto da calsse StringWriter para o browse através de Response.Write.

 

Conclusão

Aprendemos hoje como gerar página HTML com dados de um arquivo XML, através da tecnologia XSLT e a classe XslCompiledTransform. Até a próxima.