Colorindo Colunas do DataGrid

Há momentos em que queremos deixar uma coluna em destaque do nosso DataGrid para chamar a atenção do Usuário ou mesmo para dar enfase em algo que seja extremamente importante.

Podemos fazer isso no DataGrid utilizando o evento ItemDataBound do mesmo, onde podemos colorir qualquer coluna dado um índice válido, que corresponde à coluna, iniciando por 0.

Abaixo o código necessário para isso:

1
2
3
4
5
6
7
8
9
 
Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As _
    System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound
 
    If e.Item.ItemType = ListItemType.AlternatingItem OrElse _
        e.Item.ItemType = ListItemType.Item Then
 
        e.Item.Cells(1).BackColor = System.Drawing.Color.LightSkyBlue
    End if
End Sub
 

Como podem ver, através da coleção de células (Cells) do nosso DataGrid, passamos um número inteiro que corresponde à coluna que queremos resgatar e assim, termos acesso as propriedades da mesma. Através da propriedade BackColor, definimos a nova cor que desejamos. Vale também chamar a atenção para a condicional que temos que fazer para termos a certeza que estamos manipulando apenas as “linhas” correspondentes a dados e descartando os Header e Footer do DataGrid.

Colorindo a Linha do DataGrid no Evento onMouseOver

Para que a navegação fique um pouco mais interativa para o Usuário, tornando-a bem mais inteligente.

Algo que podemos fazer para melhorar, é quando o Usuário passar o ponteiro do mouse pelas linhas do DataGrid, a cor do background da célula muda para que o mesmo tenha uma referência de onde esta.

Abaixo o código necessário para isso:

1
2
3
4
5
6
7
8
9
10
 
Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As _
    System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound
 
    If e.Item.ItemType = ListItemType.AlternatingItem OrElse _
        e.Item.ItemType = ListItemType.Item Then
 
        e.Item.Attributes.Add(“onMouseOver”, “this.style.backgroundColor=’#CCCCCC'”)
        e.Item.Attributes.Add(“onMouseOut”, “this.style.backgroundColor=’#FFFFFF'”)
    End if
End Sub
 

Através dos atributos do Item em questão, que neste caso é uma TR (TableRow), utilizamos os eventos onMouseOver e onMouseOut para definirmos as cores que desejamos que fique a nossa linha quando o cursor do mouse passar por cima dela e quando o cursor sair. Vale também chamar a atenção para a condicional que temos que fazer para termos a certeza que estamos manipulando apenas as “linhas” correspondentes a dados e descartando os Header e Footer do DataGrid.

Transformando XML com XSLT

Quando temos um arquivo XML, podemos querer exibí-lo para o Usuário. Como seu formato é incompreensível para Usuários que não conhecem, pode-se estruturá-lo para exibir de uma forma mais amigável.

Para isso utilizamos XSLT para transformar o XML, mostrando assim ao Usuário algo compreensível, utilizando HTML para formatar e exibir estes valores.

Temos abaixo os arquivos XML e XSLT:

Arquivo XML (Categorias.xml):

 

Arquivo XSLT (Formatacao.xslt):

Vemos que utilizamos um for-each para percorrer os dados do XML baseando-se nas tags: “Dados/Registro”.

Agora em nosso arquivo ASPX, temos que criar a estrutura para resgatar o conteudo do Arquivo XML e carregar o arquivo XSLT, e assim aplicar este estilo no conteúdo do arquivo XML, e gerando o seu “output” em HTML, para que o browser possa compreender.

Temos que importar os seguintes Namespaces:

1
2
3
4
 
Imports System.IO
Imports System.Xml
Imports System.Xml.Xsl
Imports System.Text
 

Agora faremos essa tranformação no evento Page_Load do nosso WebForm. O código abaixo mostra como efetuar:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
Private Sub Page_Load(ByVal sender As Object, ByVal e As _
    System.EventArgs) Handles MyBase.Load
 
    Dim arquivoXML As String = Server.MapPath(“Categorias.xml”)
    Dim arquivoXSLT As String = Server.MapPath(“Formatacao.xslt”)
    Dim xmlDOC As New XmlDocument
    Dim xsltDOC As New XslTransform
    Dim sb As New StringBuilder
    Dim sw As New StringWriter(sb)
 
    xmlDOC.Load(arquivoXML)
    xsltDOC.Load(arquivoXSLT)
    xsltDOC.Transform(xmlDOC, Nothing, sw, Nothing)
    Response.Write(sb.ToString)
End Sub
 

Criamos dois objetos, sendo um do tipo XmlDocument e o outro do tipo XslTransform e carregamos os respectivos arquivos em cada um desses objetos. Depois disso, chamamos o método “Transform”, que aplica o estilo do XSLT no XML e através de um objeto do tipo StringWriter recuperamos o “output” gerado e atribuímos à um StringBuilder, e este por sua vez armazena o conteúdo que por fim escrevemos na tela através do Response.Write.

Lendo XML de uma String

Em determinados momentos quando não temos um arquivo XML fisicamente criado, mas temos seu conteúdo, qual foi recuperado de algum método ou mesmo uma Query SQL em uma String e necessitamos carregar essa String (o conteúdo XML) em um DataSet, podemos utilizar a classe StringReader juntamente com o método ReadXml do Dataset para isso.

Esta classe está contida dentro do Namespace System.IO e implementa a classe TextReader para é utilizada para ler uma sequencia de caracteres.

Temos abaixo a estrutura do conteúdo XML que iremos carregar no nosso Dataset e posteriormente atribuí-lo à um DataGrid: 

Agora veremos o código necessário para ler a String e carregarmos no Dataset. Temos que importar o seguinte Namespace:

1
 
Imports System.IO
 

Dentro do evento Load do nosso WebForm fazermos:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
Private Sub Page_Load(ByVal sender As Object, ByVal e As _
    System.EventArgs) Handles MyBase.Load
 
    Dim xml As String
    Dim ds As New Dataset
 
    xml = “<Pessoal><Funcionario><ID>00011</ID><Nome>Jose</Nome></Funcionario></Pessoal>”
 
    ds.ReadXml(New StringReader(xml), XmlReadMode.Auto)
 
    Me.DataGrid1.DataSource = ds
    Me.DataGrid1.DataBind()
End Sub
 

Chamo a atenção para o conteúdo atribuído à variável xml, que uma parte foi ocultada por questões de espaço. Através do método ReadXml do Dataset, passamos uma instância da classe StringReader que recebe no seu construtor a String XML que queremos ler. Informamos também no segundo parâmetro o XmlReadMode, que especifica como os dados em XML são lidos dentro do Dataset, e por fim, definimos a propriedade DataSource do DataGrid com o nosso Dataset já carregado e invocamos o método DataBind do DataGrid para carregá-lo.

DataGrid com Popup

Muitas vezes precisamos exibir um conjunto de dados em um controle do tipo DataGrid e como os dados não estão todos sendo exibidos ao Usuário podemos criar uma nova janela onde passamos como parâmetro para a mesma o ID, identificando o registro, e assim nesta nova janela efetuamos uma nova Query na DB e assim retornamos seu conteúdo na íntegra.

Através do Property Builder do DataGrid, podemos definir a nossa coluna que será o link que abrirá esta nova página para o Usuário como HyperLinkColumn, passando como parâmetro o ID do registro. Através da HyperLinkColumn podemos definir o texto que será o Link, que neste caso será o nome da Categoria vindo da DB, o campo da DB que indentifica o registro e o formato da URL.

Temos que definir todos esses campos para que seja enviado corretamente o valor a nova janela, principalmente na propriedade “URL Format String”, onde informamos a função Javascript que encontra-se no cliente (no arquivo ASPX).

Abaixo uma figura que nos mostra como definir os campos corretamente na HyperLinkColumn no Property Builder do DataGrid:

Depois destes dados definidos, resta criarmos a função “Visualizar” no arquivo ASPX, conforme é mostrado abaixo:

1
2
3
4
5
 
<script language=”javascript”>
    function Visualizar(id){
        window.open(‘Pagina.aspx?ID=’+ id, ”, ”);
    }
</script>
 

Infelizmente o único problema que temos quando definimos os parâmetros no Property Builder é que ele nos permite apenas utilizarmos um parâmetro dinâmico, e caso precise de mais de um, teríamos que interceptar o DataBind do DataGrid, e assim montar o link dinamicamente no código.