Visual Basic em Português

Página pessoal de Jorge Paulino sobre o Visual Basic (VB.NET, ASP.NET, VB6, VBA) e algumas noticias de tecnologia

ASP.NET: Gridview com Controlos nas Colunas

O controlo GridView é bastante usado em ASP.NET pois é muito versátil e simples de utilizar. Existem inúmeras propriedades que permitem com duas ou três alterações tornar esteticamente muito agradável e funcionalmente muito robusto. Possui ainda alguns poderosos wizards que permitem executar diversas tarefas, como por exemplo, associar a fontes de dados ou formatar a visualização.

     

No entanto algumas operações têm de ser efectuadas através do código para permitir uma manipulação de informação correcta.

     

Neste exemplo pretende-se mostrar como adicionar DropDownLists a colunas, adicionar-lhes informação e verificar os dados seleccionados.

     

Para começar adiciona-se uma GridView a uma nova página e no canto superior direito temos um wizard que nos permite realizar algumas tarefas “GridView Tasks”. Vamos seleccionar “Edit Columns”.

     

Nesta janela podemos adicionar novas colunas e modificar as existentes. Para o exemplo vamos adicionar duas colunas BoundField (associadas a um campo) e duas colunas TemplateField (onde iremos colocar as DropDownLists). Nas colunas BoundField colocamos a seguinte informação (figura 1):

     

Coluna1

HeaderText = "ID"

DataField = "id"

     

Coluna2

HeaderText = "Nome"

DataField = "nome"

     

     

(figura 1)

     

Para terminar removemos a selecção “Auto-generate fields” para que a GridView não crie as colunas automaticamente.

     

De seguida, e ainda no GridView Tasks seleccionamos “Edit Template”. No menu de Templates seleccionamos o ItemTemplate de cada coluna (2 e 3) e adicionamos uma DropDownList da Toolbox (figura 2). Para terminar seleccionamos “End Template Editing".

     


(figura 2)

     

Adicionamos um Botão (asp:button) e podemos ainda escolher a opção “Auto Format” e escolher um formato aleatoriamente a nosso gosto. No final o código ficará semelhante ao seguinte:

     

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

   

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>Untitled Page</title>

</head>

<body>

<form id="form1" runat="server">

<div>

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"

        Font-Names="Arial" Font-Size="10pt" ForeColor="#333333" GridLines="None" Width="352px">

        <Columns>

            <asp:BoundField DataField="id" HeaderText="ID" />

            <asp:BoundField DataField="nome" HeaderText="Nome" />

            <asp:TemplateField>

                <ItemTemplate>

                    <asp:DropDownList ID="DropDownList2" runat="server">

                    </asp:DropDownList>

                </ItemTemplate>

            </asp:TemplateField>

            <asp:TemplateField>

                <ItemTemplate>

                    <asp:DropDownList ID="DropDownList1" runat="server">

                    </asp:DropDownList>

                </ItemTemplate>

            </asp:TemplateField>

        </Columns>

        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />

        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />

        <EditRowStyle BackColor="#999999" />

        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />

        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />

        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />

        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />

    </asp:GridView>

    <br />

    <asp:Button ID="Button1" runat="server" Text="Verificar" Height="32px" Width="104px" />

    <br />

</div>

</form>

</body>

</html>

     

No código VB associado a esta página vamos colocar informação dinamicamente, podendo ser alterada para uma base de dados. Para este exemplo vamos utilizar um DataTable

     

     

Imports System.Data

     

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

     

    ' Verifica se é a primeira vez que a página é actualizada

    ' (para não repetir sempre que se actualize)

    If Not Page.IsPostBack Then

     

      Dim strNomes() As String = {"Jorge Miguel", "João Alexandre", _

                      "Paulo Jorge", "Rui Sousa", "Carlos Andrade"}

     

      ' Cria uma nova DataTable e adiciona duas colunas

      Dim dt As New DataTable

      dt.Columns.Add(New DataColumn("id", GetType(Integer)))

      dt.Columns.Add(New DataColumn("nome", GetType(String)))

     

      ' Adiciona as DataRows (linhas)

      Dim dr As DataRow

      For x As Byte = 0 To strNomes.Length - 1

        dr = dt.NewRow()

        dr.Item("id") = x.ToString

        dr.Item("nome") = strNomes(x).ToString

        dt.Rows.Add(dr)

      Next

     

      ' Define a DataTable criada com DataSource (fonte de dados da Gridview)

      Me.GridView1.DataSource = dt

      Me.GridView1.DataBind()

     

    End If

     

  End Sub

     

     

No evento Row Created, ou seja, sempre que cada linha da GridView é criada irá correr este evento. Neste evento adicionasse a informação às DropDownList

     

     

  Protected Sub GridView1_RowCreated(ByVal sender As Object, _

    ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowCreated

     

    ' Verifica se o item criado é do tipo DataRow

    ' e não outro como Header ou Footer

    If e.Row.RowType = DataControlRowType.DataRow Then

     

      Dim strMeses() As String = {"", "Janeiro", "Fevereiro", _

      "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", _

      "Setembro", "Outubro", "Novembro", "Dezembro"}

     

      ' Procura pela DropDownList

      Dim ctrl1 As DropDownList = e.Row.FindControl("DropDownList1")

     

      ' Preenche a DropDownList1 com os meses e selecciona um item em branco

      ctrl1.DataSource = strMeses

      ctrl1.DataBind()

      ctrl1.SelectedIndex = 0

     

      ' Preenche a DropDownList2 com os anos

      Dim ctrl2 As DropDownList = e.Row.FindControl("DropDownList2")

      ctrl2.Items.Add("")

      ' Ciclo que irá adicionar os anos em ordem decrescente

      For x As Int16 = 20 To 0 Step -1

        ctrl2.Items.Add(Year(DateTime.Now) - 20 + x)

      Next

      ctrl2.SelectedIndex = 0

     

    End If

     

  End Sub

     

     

Finalmente um ciclo executado através do botão de comando que irá mostrar de uma forma simples as selecções efectuadas

     

     

Protected Sub Button1_Click(ByVal sender As Object, _

          ByVal e As System.EventArgs) Handles Button1.Click

     

    ' Percorre todas as linhas da GridView

    For Each row As GridViewRow In GridView1.Rows

     

      ' Verifica na linha actual qual o mês seleccionado

      Dim ctrl1 As DropDownList = row.FindControl("DropDownList1")

      Dim mes As String = ctrl1.SelectedIndex

     

      ' Verifica na linha actual qual o ano seleccionado

      Dim ctrl2 As DropDownList = row.FindControl("DropDownList2")

      Dim ano As String = ctrl2.SelectedValue

     

      ' Mostra a informação no ecra

      Response.Write(ano.ToString + " " + mes.ToString + "<br>")

    Next

     

  End Sub

     

     

     

(figura 3)

     

O objectivo deste exemplo é mostrar como adicionar controlos a uma GridView e como manipula-los. Neste caso colocamos informação apenas mas poderiamos seleccionar com base em informações da base de dados ou utilizar outros controlos nas colunas.

     

     


PS: Como sempre, qualquer dúvida, comentário ou correcção ao artigo é sempre bem vinda!

1 comentários:

Meu Cerato disse...

Valeu Jorge Paulino, muito bom mesmo, me resolveu um problemão.
Obrigado

Mensagens Recentes



Microsoft Office Especialist

Membro da Comunidade
Experts-Exchange


Administ. da Comunidade
Portugal-a-Programar



Twitter

Artigos no CodeProject

Artigos no CodeProject

Subscrever Novidades

Endereço de Email:

Delivered by FeedBurner

Seguidores

Histórico