_______________________________________________________________________________

POSICIONAR A BARRA DE ROLAGEM DO NAVEGADOR APÓS UM POSTBACK

Valdir Silva¹

 

INTRODUÇÃO

Tenho recebido diversos e-mails questionando uma forma de posicionar a barra de rolagem dos navegadores após a realização de um postback, percebi também que em inúmeros fóruns de discuções sobre JavaScript e ASP.NET que a solução mais apresentada é colocar todos os elementos dentro de uma div já que este elemento cria uma barra de rolagem quando ocorre um overlow de conteúdo.

O próprio ASP.NET possui um recurso chamado MaintainScrollPositionOnPostback porém, em alguns casos este recurso também deixa algumas lacunas o que nos faz então partir para o que pra mim é o mais interessante; o código criado no braço. E é por esse motivo que nesse artigo irei apresentar uma solução fácil usando códigos em JavaScript e que funciona para os todos os navegadores que testei, sendo eles; Firefox, Internet Explorer, Google Chrome e Opera todos em suas versões atuais.

Palavras-chave: ASP.NET; Javascript; Posicionar Barra de rolagem; Postback.

 

Para darmos início ao desenvolvimento, vamos criar um novo projeto ASP.NET ou ainda você pode também adicionar uma pagina .aspx em seu projeto. Escolha umas das opções e na nova página do projeto exiba o código fonte Html pois, é nele que vamos adicionar as funções JavaScript.

Dentro da tag adicione as tags de script do JavaScript e aproveitando vamos adicionar também a nossa primeira function, acompanhe a figura 1.0

_______________________________________________________________________________

figura 1.0 – Tag Script e função scroll

Como podemos ver a função scroll() é bem simples, ela se encarrega de guardar a posição da barra de rolagem sobre o menor movimento da mesma. Nesta função estamos recebendo os valores das barras horizontal e vertica

...

 

Salve amigos,

Estou aqui outra vez para compartilhar com vocês, um problema que enfrentei e após muito pesquisar encontrei uma solução muito simples. Talvez muitos já tenham passado por isso e resolveram facilmente, outros assim como eu não tão fácil, mas vale a dica, então vamos começar.

Imaginem a seguinte situação:

Vamos construir uma página onde será realizado o cadastro de usuário e nesse cadastro pede-se um campo em especial, no nosso caso o campo será o CPF. Esta página vai herdar uma MasterPage e ai vem o problema. Bem, todos nós sabemos que este campo sofre muitas verificações antes de ser enviado ao banco de dados, nós vamos, através de Javascript, limitar o usuário a digitar somente números neste campo e ainda vamos formatar o campo de acordo com as nossas preferências enquanto o usuário digita.

Vamos então ao trabalho!

Crie um novo projeto website através do VS 2005.

Neste projeto adicione uma MasterPage e faça nela uma formatação qualquer, obviamente não esqueça de adicionar um contentPlaceHolder. Veja como ficou a minha página índex.master na figura 1.0.

Figura 1.0 - Layout Simples para a MasterPage

 

Como você pode ver, fiz um layout muitíssimo simples para este exemplo.

Agora vamos criar uma página que deve ser a de cadastro de usuário.

Adicione uma nova página, desta vez um webform e  selecione a MasterPage index.master, vou chama-la de regitro_de_usuario.aspx e nela vamos colocar um campo apenas para não nos estendermos muito.

Controle                      Propiedades               

TextBox                       ID = txtCPF                                         
                                  MaxLength = 14
                                  Width = 110px

Veja como ficou na figura 1.1.

Figura 1.1 - TextBox Formatado.

Antes de criarmos os códigos necessários para o perfeito funcionamento do textbox vamos rodar a página e revelar um pequeno “segredinho”.

Ao rodar sua aplicação, clique com o botão direito do mouse sobre a página e exiba o código fonte da mesma. Em seguida procure no código gerado pelo nome do controle txtCPF como mostra a figura 1.2.

              Figura 1.2 – Localizando o ID do controle.

 

Repare que o controle ao ser renderizado assume outro nome e não mais apenas txtCPF e conseqüentemente é com esse nome que vamos trabalhar em nossa função JavaScript!

Copie esse nome todo entre aspas e vamos criar nosso arquivo .js.

 

Adicione ao projeto um novo arquivo do tipo JavaScript File, vamos chamá-lo de funções.js. Nesse arquivo adicione a seguinte função:

function formataCPF(e)

{

      var code;

      if (!e) var e = window.event;

      if (e.keyCode) code = e.keyCode;

      else if (e.which) code = e.which;

      var character = String.fromCharCode(code);

 

      if(code==8)

      {}   

      else

      {          

        if(code > 47 && code < 58)

          {

...

 

Realizar 1 upload de arquivo com ASP.NET é tarefa muito simples. Classes e controles existentes no .NET Framework facilitam em muito nosso trabalho, e como não poderia ser diferente, venho neste arquivo demonstrar como realizar Upload de múltiplos arquivos usando um ArrayList(). Então, mãos à obra.

Abra o VS2005 e com ele crie um novo projeto do tipo Web. Elimine ou altere nome do arquivo Default.aspx, deixando como upload.aspx. Também adicione um novo diretório com o nome de upload no Projeto e seu Soluction Explorer deve estar como a imagem que segue, figura 1.0.

Figura 1.0 – Soluction Explorer

 

Adicione os seguintes controles na página upload.aspx.

  1 Controle FileUpload

            ID = fupArquivo

  1 Controle ListBox
            ID = lstArquivos

  3 Controles Button
     Button1
            ID =    btnAdicionar
            Text = Adicionar

     Button2
            ID =    btnUpload
            Text = Upload

     Button3
            ID =    btnDeletar
            Text = Deletar

  1 Label
            ID = lblMensagem
            Text = “”

Organize os controles como você preferir, eu os organizei como segue na figura 1.1

Figura 1.1 – Organização dos controles na página

Vamos agora ao código. De um duplo clique sobre o botão Adicionar e insira o seguinte código:

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.IO;

 

public partial class upload : System.Web.UI.Page

{

  //Criamos uma variável do tipo ArrayList. Perceba que ela é “Estática”

  static public ArrayList arrArquivos = new ArrayList();

 

  protected void Page_Load(object sender, EventArgs e)

    {

       //Page_Load Event.

    }

   

  protected void btnAdicionar_Click(object sender, EventArgs e)

    {

      //Vamos verificar se não existe arquivo selecionado no controle FileUpload.

      if(!fupArquivo.HasFile)

      {

        ClientScriptManager cs = Page.ClientScript;

         cs.RegisterClientScriptBlock(this.GetType(),"Erro","alert(Selecione um arquivo para carregar!)",true);

         return;

      }

      //Verificamos o tamanho do arquivo em bytes. Nesse caso faço Upload de até 11MB

      if(fupArquivo.PostedFile.ContentLength > 11000000)

      {

        ClientScriptManager cs = Page.ClientScript;

        cs.RegisterClientScriptBlock(this.GetType(), "Erro", "alert(O tamanho do arquivo é maior que o tamanho permitido!)", true);       

...

Saudações a todos.

Neste artigo vamos conhecer um pouco mais sobre algumas funções do SqlDatasource em especial a função Select().

Para iniciarmos nossos estudos vamos antes saber como usá-la e qual é o seu retorno.

Em muitas situações do dia-a-dia temos que manipular controles SqlDataSource via código. Tal controle nos oferece propriedades e métodos importantíssimos para manipulação de dados, um deles é o Select. Este método executa uma consulta SQL baseada no comando definido na propriedade SelectCommand. Para que tal método funcione corretamente devemos proceder da seguinte forma.

      //Declaramos a variável string de conexão

      //Em seguida a string da consulta sql

      String conexao = "Data Source=ERA; Initial Catalog=AdventureWorks; Integrated Security=True";

      String sqlConsulta = "Select * From Person.Address Where City=Bothell";

      //Informamos a string de conexão para o SqlDataSource

      ds.ConnectionString = conexao;

      //Definimos qual o tipo de retorno do método. São dois DataSet e DataReader o padrão é DataSet.

      ds.DataSourceMode = SqlDataSourceMode.DataSet;

      //Passamos ao SelectCommand a consulta SQL.

      ds.SelectCommand = sqlConsulta;

      //Definimos o tipo de comando. Pode ser Text ou StoredProcedure 

      ds.SelectCommandType = SqlDataSourceCommandType.Text;

      //Executamos o Select().

      ds.Select(DataSourceSelectArguments.Empty);

 

Bem, vimos que para executar uma consulta usando o controle SqlDataSource é muito simples, mas qual é o retorno desta consulta?

A resposta é simples, veja que na linha ds.DataSourceMode = SqlDataSourceMode.DataSet estamos informando qual será o meu retorno, em outras palavras definimos um DataSet. Desta forma podemos vincular esse objeto a um Gridview por exemplo e ainda usar paginações e classificação dos dados, porém se definirmos como DataReader teremos os dados como read-only e  forward-only cursor.

 

Agora que já conhecemos um pouco do método select() vamos descobrir, por exemplo o total de registros de uma consulta. Obviamente existem muitas outras opções para tal tarefa, mas suponhamos que preciso tomar uma decisão baseado no retorno do método Select do controle SqlDataSource, ai é chegada a hora de trabalhar com eventos do SqlDataSource. Para uma prática mais real vamos criar um projeto web no VS2005 e nele acrescentar um GridView e um controle SqlDataSource, alem de um controle Label. Vou chama-los de grdConsulta, sqlDsConsulta e lblRetorno respectivamente.

 

Não precisa nenhuma configuração adicional. Vamos entra no evento Page_Load do arquivo Default.aspx e nele vamos adicionar o código necessário para a consulta como segue.

 

      //Declaramos a variável string de conexão

      //Em seguida a string da consulta sql

      String conexao = "Data Source=ERA; Initial Catalog=AdventureWorks; Integrated Security=True";

...

Olá pessoal,

Como havia prometido no artigo anterior (EXPLORANDO O CONTROLE DATALIST - Parte 02), venho com este artigo que é último, sobre o controle DataList.

Neste artigo vou mostar como listar de forma organizada, produtos que estão em um banco de dados, inclusive com suas respectivas imagens...

Confira na imagem o modelo final:

 

Vamos então ao código...

Chamei este arquivo de index.aspx

 

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>

<%@ Import Namespace="System.Data.SqlClient" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<script language="C#" runat="server">

    SqlConnection conectar;

    void Page_Load(Object sender, EventArgs e) {

      conectar = new SqlConnection(ConfigurationManager.ConnectionStrings["conexao"].ConnectionString);

 

        if (!Page.IsPostBack) {

            SqlDataAdapter cmd = new SqlDataAdapter("Select * From TLivros Order By titulo", conectar);

            DataSet ds = new DataSet();

            cmd.Fill(ds, "Titulos");

            DataListLivros.DataSource=ds.Tables["Titulos"].DefaultView;

            DataListLivros.DataBind();

        }

    }

 

  void DataListLivros_Select(Object sender, EventArgs e)

  {

        String IdTitulo = DataListLivros.DataKeys[DataListLivros.SelectedItem.ItemIndex].ToString();

        SqlDataAdapter cmd = new SqlDataAdapter("Select * From TLivros Where id = " + IdTitulo, conectar);

        DataSet ds = new DataSet();

        cmd.Fill(ds, "DetalhesTitulos");

        DataRowView rowview = ds.Tables["DetalhesTitulos"].DefaultView[0];

        imgDetalhes.Src = "imagens/" + rowview["imagem"];

        IdLivro.Text = "<b>ID: </b>" + rowview["id"].ToString() + "<br>";

        lblGenero.Text = "<b>Gênero: </b>" + rowview["genero"].ToString() + "<br>";

        lblValor.Text = "<b>Valor: </b> R$ " + rowview["valor"].ToString() + "<p>";

        lnkComprar.Text = "<img alt=Comprar este Livro border=0 src=imagens/comprar.gif >";

        lnkComprar.Visible = true;

        lnkComprar.NavigateUrl ="#" + rowview["id"].ToString();

        lblTitulo.Text = rowview["titulo"].ToString();

        imgDetalhes.Visible = true;

        lnkComprar.Attributes.Add("onclick", "alert(Direcione seu usuário para a página de " +

                                  "aquisição do livro:\\n" + rowview["titulo"].ToString() + ")");

    }

 

  void DataListLivros_ItemCommand(Object sender, DataListCommandEventArgs E)

  {

        String titulo = DataListLivros.DataKeys[E.Item.ItemIndex].ToString();

        String commando = E.CommandName;

       

      switch(commando) {

          case "Discutir" :

            ShowDiscutir(titulo);

            break;

          case "Avaliar" :

            ShowAvaliar(titulo);

            break;

        }

    }

 

  void ShowAvaliar(String titulo)

    {

        Message.InnerHtml = "<h5>Avaliações para o ID <font color=red>\"" + titulo + "\"</font></h5>";

        Message.InnerHtml += "Você pode imprimir as avaliações aqui...";

    }

 

  void ShowDiscutir(String titulo)

    {

      Message.InnerHtml = "<h5>Discuções para ID <font color=red>\"" + titulo + "\"</font></h5>";

        Message.InnerHtml += "Imprima as discuções sobre o livro aqui...";

    }

 

</script>

 

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

<head runat="server"> <title>Lista de Livros</title

...

Saudações pessoal,

Continuando com a série de artigos sobre DataList, venho neste artigo mostrar as funcionalidades deste controle quanto a edição de dados.

Então vamos ao trabalho....

 

Edição de Dados em um Controle DataList

 

O controle de DataList suporta a edição in-place dos dados em um registro através de sua propriedade EditItemTemplate. O EditItemTemplate define o conteúdo e a aparência do item quando está sendo editado. Por exemplo, o seguinte Template inclui uma caixa de texto, um botão de “Update” e um botão de “Cancelar”.

 

 

<EditItemTemplate>

    Item: <asp:TextBox

            id="Text1"

            runat="server"

            Text=<%# DataBinder.Eval(Container.DataItem, "Campo")%>

    /><br>

   

<asp:LinkButton

    id="button1"

    runat="server"

    Text="Salvar"

    CommandName="update"

    />

<asp:LinkButton

     id="button2"

     runat="server"

     Text="Cancelar"

     CommandName="cancel"

    />

</EditItemTemplate>

 

 

O EditItemTemplate interage com uma outra propriedade: EditItemIndex. Por default, o valor de EditItemIndex é -1, significando que nenhum dos registros na lista está sendo editado. Quando EditItemIndex é ajustado a um registro em particular, esse registro é alterado usando o EditItemTemplate.

 

 

O DataList fornece também eventos que podem ser usados na edição.

EditCommand é chamado quando o usuário clica no botão (comando “update”) Editar dentro de ItemTemplate do DataList. Você pode adicionar código a este evento. A propriedade EditItemIndex é ajustada ao registro selecionado, e então executa um rebinds nos dados do DataList como mostrado no exemplo que segue.

 

protected void DataList_EditCommand(object Source, DataListCommandEventArgs e)

  {

    DataList1.EditItemIndex = (int)e.Item.ItemIndex;

    BindList();

  }

 

 

O EditItemTemplate contem tipicamente botões de comando de “update” e “cancel”. Estes botões chamam os eventos de UpdateCommand e CancelCommand, respectivamente. Você pode também programar estes eventos em seu código. A lógica para “cancelar” a edição de um registro é ajustar EditItemIndex a -1, e então fazer um rebinds dos dados ao DataList como mostrado no exemplo abaixo.

 

protected void DataList_CancelCommand(object Source, DataListCommandEventArgs e)

  {

    DataList1.EditItemIndex = -1;

    BindList();

  }

 

 

 

A lógica típica para fazer um “update” e atualizar a origem dos dados é ajustar EditItemIndex em -1, e então efetuar um rebinds (recarga) dos dados ao DataList. O exemplo abaxio mostra a edição de registros em um DataList.

 

 

 

 

<%@ Import Namespace="System.Data" %>

 

<html>

<head>

    <script language="C#" runat="server">

 

    public DataTable Cart;

    public DataView CartView;

 

    void Page_Load(Object Sender, EventArgs E) {

        if (Session["DL3_ShoppingCart"] == null) {

            Cart = new DataTable();

            Cart.Columns.Add(new DataColumn("Qty", typeof(string)));

            Cart.Columns.Add(new DataColumn("Item", typeof(string)));

            Cart.Columns.Add(new DataColumn("Price", typeof(string)));

            Session["DL3_ShoppingCart"] = Cart;

 

            // carregar a primeira vez -- popula com alguns dados

            for (int i=1; i<5; i++) {

                DataRow dr = Cart.NewRow();

                dr[0] = ((int)((i%2)+1)).ToString();

                dr[1] = "Item " + i.ToString();

                dr[2] = ((double)(1.23 * (i+1))).ToString();

                Cart.Rows.Add(dr);

            }

        }

        else

            Cart = (DataTable)Session["DL3_ShoppingCart"];

 

        CartView = new DataView(Cart);

        CartView.Sort = "Item";

        if (!IsPostBack)

...

Saudações a todos,

 

Estou novamente presente no portal DevMedia e desta vez para falar do controle DataList. Em uma série de artigos vou mostrar o que tem de melhor neste controle que não pode faltar em suas páginas .NET. Acompanhe os artigos e boas práticas.

 

 

DataList - Visão Geral

 

O controle de DataList é fortemente usado para a exibição de dados em uma lista repetida, como por exemplo uma tabela com a lista de produtos mais vendidos ou ainda com os produtos em destaque. Este controle suporta ainda selecionar e editar seus registros. O conteúdo e a disposição dos registros na lista em um controle DataList são definidos usando Templates. No mínimo, cada DataList deve definir um ItemTemplate, entretanto, diversos Templates opcionais podem ser usados customizando ainda mais a aparência da lista.

A tabela 1  descreve os Templates existentes para este controle.

 

Template Name

Descrição

...

Saudações a todos!

 

Neste artigo vou mostrar como criar uma janela de alerta muito semelhante à janela de alerta do Live Messenger através de uma DLL existente na web.

 

Em anexo, deixo a DLL e o projeto deste exemplo para download, baixe para seu PC e divirta-se!

 

Vamos então ao trabalho.

 

Crie um novo projeto web usando C# como Language.

 

Antes de mais nada extraia a DLL (EeekSoft.Web.PopupWin.dll) em um diretório qualquer do seu computador. Esta DLL está em anexo para download juntamente com o projeto deste exemplo.

Após descompactar a dll devemos adicionar uma tab no VS.NET 2005 para carregarmos e ter assim acesso aos controles desta dll. Então clique com o botão direito do mouse sobre a área abaixo da tab General e clique em Add Tab. Digite um nome para esta tab e tecle Enter. Acompanhe a figura 1.

Figura 1 – Adicionando e Nomeando a Tab

 

Após esse processo vamos agora inserir nesta tab a DLL do popup. Clique com o botão direito do mouse dentro desta tab e escolha a opção Choose Items... e na janela Choose Toolbox Items clique no botão Browse e localize o diretório onde você copiou a DLL,  selecione a DLL e clique em Open, em seguida clique no botão OK.

Note que será adicionado 2 controles, nesse artigo vamos trabalhar com popupWin.

 

Pronto, estamos aptos a trabalhar com a DLL.

Neste exemplo vamos simular que um usuário faça login em nosso site e quero dar-lhes boas vindas, então vamos usar o controle popupWin para tal tarefa.

 

Na página Default.aspx insira 2 controles Labels, 2 Textbox e um LinkButton. Ajuste o layout como você preferir, confira o meu layout na figura 2. 

 

Controle ............ Propriedade ............ Valor

Label1                          ID                         lblLogin
                                     Text                      Login
------------------------------------------------------------------ 

Label2                           ID                         lblSenha

                                     Text                      Senha
------------------------------------------------------------------ 

Textbox1                       ID                         txLogin
------------------------------------------------------------------ 

Textbox2                       ID                         txSenha

                                     TextMode              Password
------------------------------------------------------------------ 

LinkButton1                   ID                         btnLogar

                                     Text                      Efetuar Login
                                     PostBackUrl           “~/boas_vindas.aspx”

Figura 2- Layout de Login

  

...

Olá pessoal,

 

Aqui estou com mais um artigo para o portal DevMedia. Neste artigo vou mostrar como navegar sobre os registros de um Gridview usando as teclas de navegação (Setas de direção á e â do teclado).

 

Vamos então ao trabalho.

 

Crie um novo projeto web usando C# como Language.

 

Vamos usar a página Default.aspx. Nela adicione um controle Gridview.

 

Crie uma conexão com um banco de dados qualquer, de sua preferência apenas para preencher o grid com dados e assim construirmos nosso exemplo.

 

Estou usando o SQL Server 2005, veja na figura 1 como ficou meu grid.

Figura 1 – Gridview com Registros de um Database

 

Perfeito, nossa primeira tarefa está concluída. Vamos agora criar duas funções JavaScript para manipular as linhas do Gridview.

 

Entre no Source da página Default.aspx e dentro da TAG digite o seguinte código javascript:

 

/SPAN>head id="Head1" runat="server">

    /SPAN>title>Navegar com setas sobre o Gridviewtitle>

 

    /SPAN>script type="text/javascript">

 

        var currentRowId = 0;

        function NavegarComTeclado()

        {

            if (event.keyCode == 40)

                MarcarLinha(currentRowId+1);

            else if (event.keyCode == 38)

                MarcarLinha(currentRowId-1);

        }      

 

        function MarcarLinha(rowId)

        {

          if (document.getElementById(rowId) == null)

              return;

          if (document.getElementById(currentRowId) != null )

          // Retorna a primeira alinha do Grid quando clicar.

...

Aprendendo Sobre controles de validação

 

Este artigo é apenas para acabar com algumas dúvidas que vejo nos fóruns existentes na web.

Neste artigo vou mostrar alguns exemplos e aplicações para todos os controles de validação, com exceção do RequiredFieldValidator o qual é o mais simples e fácil de utilizar.

 

Vamos então ao trabalho...

 

Começamos com o CompareValidator.

 

CompareValidator_Simples

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

<head runat="server">

    <title>Controle de Validação</title>

</head>

<body>

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

<table border="0" bgcolor="#b0c4de">

<tr valign="top">

<td colspan="4"><h4>

  Comparando dois valores:</h4></td>

</tr>

<tr valign="top">

<td><asp:TextBox id="txt1" runat="server" /></td>

<td> = </td>

<td><asp:TextBox id="txt2" runat="server" /></td>

<td style="width: 63px">

<asp:Button ID="btnValidar" Text="Validar" runat="server" /></td>

</tr>

</table>

<br />

<asp:CompareValidator

id="CompareValidator1"

Display="dynamic"

ControlToValidate="txt1"

ControlToCompare="txt2"

ForeColor="red"

BackColor="yellow"

Type="Double"

EnableClientScript="false"

Text="Valores não são iguais"

runat="server" />
</form>

</body>
</html>

Execute sua aplicação e faça alguns testes com esse exemplo!!!

 

CompareValidator_Usando um List

 

Vamos agora dar ao usuário a opção de escolha entre comparar valores "iguais" ou "diferentes" através do evento OnSelectedIndexChanged do ListBox.

 

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

<head runat="server">

    <title>Controle de Validação</title>

</head>

<body>

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

<table border="0" bgcolor="#b0c4de">

<tr valign="top">

<td colspan="4"><h4>

  Comparando 2 valores</h4></td>

</tr>

<tr valign="top">

<td><asp:TextBox id="txt1" runat="server" /></td>

<td>

<asp:ListBox id="list" rows="2" OnSelectedIndexChanged="check_operador" runat="server">

<asp:ListItem value="Equal" selected>=</asp:ListItem>

<asp:ListItem value="NotEqual"><></asp:ListItem>

</asp:ListBox>

</td>

<td><asp:TextBox id="txt2" runat="server" /></td>

<td><asp:Button ID="btnValidar" Text="Validar" runat="server" /></td>

</tr>

</table>

<br />

<asp:CompareValidator

id="CompareValidator1"

Display="dynamic"

ControlToValidate="txt1"

ControlToCompare="txt2"

ForeColor="red"

BackColor="yellow"

...

Olá pessoal!

Estou novamente trazendo mais um artigo o qual considero no mínimo interessante.

Como enviar um e-mail com todo o conteúdo e as propriedades de um Gridview?

Pois bem, vocês verão ao final deste artigo que isso é muito fácil de ser programado.

Espero que gostem e que obviamente seja útil a todos...

Em anexo está o projeto completo deste artigo...

 

Antes de iniciarmos com esse artigo, vamos configurar o nosso servidor SMTP.

Este servidor SMTP pode ser instalado no mesmo instante da instalação do IIS.

 

Configurações do Serviço SMTP

Para configurar o SMTP server teremos que seguir os passos indicados abaixo:

Abra o IIS e clique com o botão direito do sobre a opção Servidor virtual SMTP Padrão e escolha Propriedades como ilustrado na figura 1.

 

Figura 1 – Internet Information Services (IIS)

 

 

Ao clicar sobre a opção propriedades será exibido a janela da figura 2, onde você deve escolher o seu endereço de IP no campo Endereço de IP.

 

Figura 2 - Propriedades de Servidor virtual SMTP padrão

 

 Faça as configurações como na Figura 2, selecionando seu próprio endereço de IP.

 

Passe agora para a aba Acesso e clique em Retransmitir. Você terá agora a tela da Figura 3A onde você deve clicar no botão Adicionar e na janela ilustrada na figura 3B você deve informar o localhost com endereço de IP 127.0.0.1.

Para finalizar, confirme as configurações clicando a seqüência de botões OK – OK – Aplicar – OK.

 

Figura 3A/3B. Configurando a retransmissão das mensagens  / Configurando a conexão

 

Bem vamos agora ao envio de email com o conteúdo de um Gridview.

 

Crie um novo WebSite. Neste artigo estou usando C# como "Language".

 

Coloque na página um controle Button, um Gridview, um Label e um SQLDataSource (Para conexão com SQL Sever) e faça uma vinculação simples a uma base de dados qualquer, apenas para que tenhamos conteúdo no gridview para ser enviado por email. Veja na figura 4 o layout do meu exemplo.

 

Figura 4 – Layout Gridview

 

 

No Solution Explorer, clique com o botão direito do mouse sobre o projeto e escolha Add New Item. Selecione a opção Class e clique em OK. Vamos criar uma classe com o seguinte código:

 

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

 

/// <summary>

/// Summary description for Class1

/// </summary>

public class MinhaPagina : Page

{

 

  public override void VerifyRenderingInServerForm(Control controle)

  {

 

    GridView grid = controle as GridView;

 

    if (grid != null && grid.ID == "GridView1")

      return;

    else

      base.VerifyRenderingInServerForm(controle);

 

  }

 

}

 

 

Explicando o código acima:

 

O código adicionado na classe que criamos se faz necessário, pois se não o fizermos ao tentar enviar o email com o Gridview vai ocorrer uma exceção, isso porque o controle GridView deve ser colocado dentro de um elemento de FORMULÁRIO (HtmlForm). Isto se deve ao fato de que ao executar o RenderControl o método VerifyRenderingInServerForm da página será chamado para verificar se o controle está sendo renderizado  dentro do elemento do FORMULÁRIO (tag Form). Neste caso devemos tratá-lo manualmente, para que não tenhamos problemas com exceções (erros).

Para certificar-se de tal problema, podemos, como em nosso exemplo, criar nossa própria página customizada e cancelar o método VerifyRenderingInServerForm. Obviamente você deverá também herdar nossa classe customizada.

...

Saudações a todos os usuários do Portal DevMedia.

Neste artigo vou mostrar uma forma simples e muito útil de validar dados, quando na edição de um Gridview.

Para iniciarmos nosso trabalho, abra o VS 2005 e crie um novo Website, não se preocupe com a linguagem de programação usada, tal tarefa não exigira codificação alguma.

Em seguida insira em sua página um controle Gridview e um SqlDataSource (Estou usando o SQL Server 2005) e configure o SqlDataSource para exibir alguns campos no Gridview. Não esqueça de clicar no botão Advanced e marque a opção Generate INSERT, UPDATE and DELETE statements para que seja criado as intruções SQL referente a cada comando figura 1.

 

Após estes passos, vincule o Gridview com o SqlDataSource e faça as configurações de cores e tamanho a seu gosto e usando a smartag do Gridview habilite a opção Enable Editing, veja na figura 2 como formatei meu Gridview.

 

Como você pode notar não precisamos de nenhum código pra chegar até este ponto deste artigo. Agora vamos à parte que interessa! A validação dos campos quando em modo de edição.

Bem, imaginamos que ao editar algum registro deste Gridview um usuário deixe em branco o campo Nome por exemplo, obviamente devemos informá-lo que o mesmo não pode ser nulo. Uma forma muito fácil de fazer isso é convertendo esse campo em um Template Field, desta forma poderemos validar este campo usando os controles de validação do VS 2005.

Clique na Smartag do Gridview, em seguida clique em Edit Columns...

Selecione o campo Nome e clique no link Convert this Field into a TemplateField, figura 3.

 

 

Clique em OK para voltar ao VS 2005.

Clique com o botão direito do mouse sobre o Gridview e selecione Edit Template à Column[2] – Nome (no meu exemplo) figura 4.

...