O controle GridView é usado para exibir dados no formato tabular além de fornecer as funcionalidades para incluir, alterar e excluir registros do banco de dados relacionado. Durante a alteração ou inclusão de dados, geralmente temos que efetuar a validação dos mesmos antes de salvar no banco de dados. Este artigo mostra como você pode integrar os controles de validação com o controle Gridview de forma dinâmica em tempo de execução.

Os controles de validação que a ASP .NET disponibiliza são:

1. RequiredFieldValidator
2. RangeValidator
3. RegularExpressionValidator
4. CompareValidator
5. CustomValidator

O que vamos mostrar é como os controles de validação podem ser criados dinamicamente em tempo de execução e serem integrados com qualquer controle de entrada de dados, no caso o GridView.

As ferramentas usadas neste artigo são:

• Visual Web Developer 2008 Express Edition (VWD2008);
• SQL Server 2005 Express Edition (você pode usar o Microsoft Access);

Abra o VWD2008 e no menu File selecione New Web Site;

A seguir, faça o seguinte:

• Selecione o template ASP .NET Web Site;
• Selecione File System em Location;
• Selecione a linguagem Visual Basic em Language (note que poderíamos usar C#);
• Informe o nome do web site em uma pasta local. No exemplo eu estou informando: validaGridView
• Tecle o botão OK;

Na janela Solution Explorer selecione o formulário web Default.aspx e a partir da Caixa de Ferramentas (ToolBox) faça o seguinte:

• • Arraste e solte o controle GridView na área de Design;
  • Defina a propriedade AutoGenerateColumns do GridView como false;
  • Defina uma formatação padrão ao GridView;

Vamos criar agora o banco de dados Clientes.mdf no SQL Server que será usado neste artigo.

No menu WebSite selecione Add New Item;

A seguir, na janela Add New Item, selecione o template SQL Server Database, informe o nome Clientes.mdf e clique em Add;

Nota: Será apresentada uma caixa de diálogo solicitando a sua confirmação para copiar o arquivo para a pasta App_Data; Confirme;

Abra a pasta App_Data e clique no arquivo Clientes.mdf para abrir o DataBase Explorer;

Expanda os objetos do DataBase e clique com o botão direito sobre o objeto Tables e selecione Add New Table;

Vamos definir a tabela Contatos com a seguinte estrutura da seguinte forma:

• No editor, você digita o nome da Coluna, define o seu tipo e define se a coluna permite valores Nulls;
• A seguir, define a coluna clienteID como sendo a chave primária do tipo identidade (identity), com isso ela será auto-incremental;
• Para encerrar, você clica no ícone para Salvar e informa o nome Contatos;
• Defina os campos: clienteID, nome, sexo, idade, cidade e email; (A coluna sexo permitirá os valores M e F)

Vamos incluir alguns dados na tabela. Na janela DataBase Explorer clique com o botão direito sobre o nome da tabela Contatos recém-criada e selecione Show Table Data. A seguir, informe alguns dados, conforme mostra a figura a seguir:

Com isso já temos o nosso banco de dados Clientes.mdf e a nossa tabela Contatos. Vamos continuar. Selecione o formulário web Default.aspx, acione o modo Design e selecione o controle GridView.

Tecle F4 para abrir a janela de propriedades e defina na propriedade DataKeyNames o campo clienteID. Selecione o GridView, acione a GridView Tasks e selecione a opção Edit Columns. Inclua 5 colunas BoundField no GridView e defina as seguintes propriedades para cada uma delas:

Conforme a figura abaixo:

Inclua uma coluna CommandField, defina seu tipo de comando como Edit/Update e traduza os textos pertinentes (se desejar);

Agora converta todos os campos vinculados (BoundField) no GridView para TemplateField, para isso, selecione o campo em Selected Fields e clique no link Convert this field into a TemplateField.

Volte a selecionar o GridView e em GridView Tasks clique no link Edit Templates.

Defina cada campo convertido como TemplateField da seguinte forma:

1. A seção ItemTemplate deverá possui um controle Label vinculado coluna de nome correspondente. Ex: coluna Nome -> Bind(“nome”)

2. A seção EditItemTemplate deverá possuir um controle TextBox vinculado à coluna de nome correspondente. Ex: Coluna Nome -> Bind(“Nome”)

Em seguida, a partir da ToolBox, na guia Validation, para a coluna Nome, inclua o controle RequiredFieldValidator e defina as seguintes propriedades:

• ErrorMessage = Informe o nome;

• • ControlToValidate = TextBox1;

Os demais controles de validação serão definidos via código. A seguir temos quais os controles iremos usar para cada uma das colunas:

Dessa forma, temos o controle de validação definido para Nome em tempo de desenho e os demais controles iremos definir em tempo de execução via código.

Agora, temos que efetuar a vinculação do controle GridView com a nossa fonte de dados: a tabela Contatos do banco de dados Clientes.mdf.

Como vamos fazer isso via código, vamos criar um método chamado vinculaGrid() no arquivo Default.aspx.vb com o seguinte código:

Private Sub vinculaGrid()

 Dim
conn As String = "Data
Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Clientes.mdf;Integrated
Security=True;User Instance=True"

        Dim sql As String = "Select * from Contatos order by Nome"
        Dim da As SqlDataAdapter = New SqlDataAdapter(sql, conn)
        Dim dt As DataTable = New DataTable()

        da.Fill(dt)

        GridView1.DataSource = dt
        GridView1.DataBind()
    End Sub

Lembrando que devemos declarar no início do arquivo os imports:

Imports System.Data.SqlClient

Imports System.Data

Para chamar o método acima, vamos usar o evento Load da página da seguinte forma:

 Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            vinculaGrid()
        End If
    End Sub

Executando o projeto neste momento, iremos obter:

O próximo passo é habilitar a edição e o cancelamento da edição, pois se você clicar no link Edita irá ocorrer um erro.

Lembre-se de que o nosso GridView não foi gerado usando um assistente e por isso não possui os eventos para edição e cancelamento ativos. Vamos ativá-los…

No evento RowEditing do controle GridView informe o código abaixo para permitir a edição:

Protected Sub GridView1_RowEditing(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewEditEventArgs) _
                   Handles GridView1.RowEditing
                           GridView1.EditIndex = e.NewEditIndex
        vinculaGrid()
    End Sub

Para permitir o cancelamento do evento acima, vamos incluir o código abaixo no evento RowCancelingEdit:

Protected Sub
GridView1_RowCancelingEdit(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.GridViewCancelEditEventArgs) _
Handles GridView1.RowCancelingEdit
        GridView1.EditIndex = -1
        vinculaGrid()
    End Sub

Executando o projeto neste momento e a seguir clicando no link Edita iremos conseguir efetuar a edição dos dados. Para a coluna Nome, como já temos o controle de validação definido, ao tentar informar um nome em branco obteremos o resultado abaixo:

Precisamos então definir os demais controles de validação e, para isso, vamos usar o evento RowDataBound do controle GridView.

Para a coluna Sexo iremos usar o controle CustomValidator, que é usado para validar uma entrada de forma customizada no lado do cliente ou do servidor. No exemplo iremos usar uma validação JavaScript do lado do cliente. Lembre-se de que a coluna Sexo deve aceitar somente os valores M, para masculino, e F, para feminino.

Primeiro vamos definir criar o código que define o controle em tempo de execução no servidor:

Depois verificamos se a linha é do tipo DataRow, ou seja, é uma linha de dados e não de cabeçalho;

A seguir verificamos se EditIndex é igual ao índice da linha atual (RowIndex) para em seguida definir via código o controle CustomValidator;

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) _
Handles GridView1.RowDataBound

If e.Row.RowType = DataControlRowType.DataRow Then

'Verificando se EditIndex é igual a Row Index atual

'então vincula os controles de validação a linha particular

If GridView1.EditIndex = e.Row.RowIndex Then

'Coluna Sexo- definindo o CustomValidator

Dim cv As CustomValidator = New CustomValidator

cv.ID = "CustomValidator1"

cv.ControlToValidate = "TextBox2"

cv.ErrorMessage = "Informação inválida"

cv.SetFocusOnError = True

cv.ValidateEmptyText = True

cv.ClientValidationFunction = "validaSexo"

e.Row.Cells(1).Controls.Add(cv)

End If

End If

End Sub

• No código acima criamos uma instância da classe CustomValidator e definimos um ID para esta instância;
• A seguir especificamos o controle que será validado, no caso o controle TextBox2;
• Definimos a mensagem de erro em ErrorMessage.

Fonte: Imasters