Conheça o Júlio Battisti

Julio Battisti - Autor de mais de 25 livros de informática Júlio Battisti tem mais de 50 livros publicados, centenas de e-books e é certificado Microsoft.

SAIBA MAIS...

Loja Virtual do Site

Curta Nossa Fanpage

« Lição anterior

Δ Página principal

¤ Capítulos

Próxima lição »

ASP.NET - CURSO COMPLETO
Autor: Júlio Battisti

Lição 049 - Capítulo 06 - Enfim vamos iniciar com ASP.NET

Vamos conhecer as principais características de uma página ASP.NET.

A extensão do arquivo mudou - ".aspx"

A primeira diferença que notamos é na extensão dos arquivos. As páginas ASP, desde a versão inicial até a versão 3.0 tem a extensão .asp. Esta extensão é obrigatória, para que o IIS reconheça a página como uma página ASP e passe o processamento para o interpretador ASP (ASP.DLL). Já as páginas ASP.NET tem a extensão .aspx, a qual é reconhecida pelo IIS (após a instalação do Framework .NET). O processamento da página ASP.NET é passada para o controle do Framework .NET. O serviço responsável pelo processamento das páginas ASP.NET está contido na DLL – XSPISAPI.DLL.

Inserindo código ASP.NET

Para inserirmos código em uma página ASP.NET utilizamos a tag <SCRIPT>, com o atributo RUNAT igual a server. A linguagem padrão para a criação de páginas ASP.NET é o VB.NET. Observe bem que não é o VBScript e sim o Visual Basic NET – VB.NET. No exemplo a seguir estamos definindo uma seção de código, na qual utilizaremos o VB.NET:

<script language=”VB” runat=”server”>

            comando1

            comando2

...

            comandon

</script>

Na Listagem 6.2 colocamos a estrutura básica de uma página ASP.NET, onde temos uma seção de código e uma seção com os elementos que formam a parte visual, ou de apresentação da página.

Listagem 6.2 – A estrutura básica de uma página ASP.NET.

<html>

<script language=”VB” runat=”server”>

            comando1

            comando2

...

            comandon

</script>

<body>

            controles e

            demais

            elementos

            da interface

            - Server controls

            - Web Forms

            -  etc

</body>

</html>

Toda página ASP.NET tem esta estrutura. Uma parte inicial onde temos o código, responsável pela lógica da página. Na seção de código, como é chamada, podemos colocar comandos para fazer a conexão com um banco de dados, para realizar cálculos, para responder a eventos que acontecem na página, como por exemplo um clique do usuário em um botão, enfim, toda a lógica de programação necessária ao funcionamento da página. A seção de código é representada pelo seguinte trecho.

<script language=”VB” runat=”server”>

            comando1

            comando2

...

            comandon

</script>

Na segunda parte da página, a partir da tag <body>, colocamos os elementos de apresentação da interface. Nesta parte podemos colocar desde código HTML básico, até controles mais avançados como os disponibilizados pelo ASP.NET. Nos Capítulos 7, 8 e 9 estaremos estudando os controles disponíveis com o ASP.NET.

Tudo o que você já conhece de HTML pode ser utilizado na seção de apresentação da página.

Se ao invés de utilizarmos o VB quiséssemos utilizar a linguagem C#, teríamos que definir a tag <script>, da seguinte maneira:

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

            comando1

            comando2

...

            comandon

</script>

Nos exemplos deste livro estaremos utilizando o C#. Para uma introdução à linguagem C# consulte os Capítulos 3, 4 e 5.

Observe que a estrutura de uma página ASP.NET deixa bem claro a separação entre código ASP.NET e código de apresentação, bem diferente do que acontecia com o ASP 3.0 onde seções de código ASP são intercaldas com seções de código HTML.

A estrutura apresentada na Listagem 6.2 é o que chamamos de “Code Inline”, ou seja, o código na própria página ASP.NET, embora em uma seção de código, separada da seção de apresentação.

Outra maneira de procedermos a separação entre código e apresentação é através da técnica chamada de “Code Behind”. Com esta técnica colocamos o código em um arquivo separado da página ASP.NET. Na página ASP.NET colocamos um comando para acessar o arquivo onde está o código.

Para utilizar Code Behind utilizamos o seguinte comando:

<%@Page  Inherits=”nome_da_classe” Src=”Caminho para o arquivo com o código” %>

Por exemplo, vamos criar o código utilizando a linguagem C# e salvar o código em um arquivo chamado codex1.cs, na mesma pasta onde está a página ex1.aspx. No início da página ex1.aspx, devemos colocar o seguinte comando, para termos acesso ao código do arquivo codex1.cs:

<%@Page Inherits=”codex1” Src=”codex1.cs”  %>

Esta deve ser a primeira linha da página, antes inclusive da tag <html>.

A utilização de Code Behind facilita o reaproveitamento de código. Vamos supor que estejamos criando uma série de páginas que acessam um banco de dados no SQL Server 2000. Podemos colocar o código de acesso ao banco de dados em um arquivo separado e utilizar a diretiva @Page para ter acesso a este código em cada página onde o acesso ao SQL Server 2000 for necessário. Se por algum motivo a forma de acesso tiver que ser modificada, basta alterar o arquivo com o código e pronto, as páginas que fazem uso deste arquivo passarão a acessar a versão atualizada. Se a página já tiver sido acessada anteriormente e estiver no cache de páginas no servidor IIS, o Framework .NET detecta que houve mudanças em um dos elementos da página. A primeira vez que a página for solicitada após as mudanças, uma nova versão da página será compilada e enviada para o usuário. A nova versão será mantida no cache para melhorar o desempenho. Se novas mudanças forem detectadas, o processo todo se repete.

Um pequeno exemplo, só para começar

Vamos apresentar alguns exemplos, para que você possa ver o ASP.NET em funcionamento. Neste momento não entrarei em maiores detalhes sobre o código. Irei detalhar mais a estrutura, a disponibilização e acesso às páginas no servidor IIS.

Exemplo 1

Vamos criar um exemplo bastante simples. A nossa página contém dois controles do tipo texto, onde o usuário pode digitar informações. A página também contém um botão de comando. Ao clicar no botão de comando é gerado o evento Click do respectivo botão. Vamos utilizar este evento. No evento Click do botão de comando vamos verificar os valores digitados nos campos usuário e senha e compará-los com valores previamente definidos, no próprio código do evento. Se os valores digitados forem iguais aos valores previamente definidos, emitimos uma mensagem: “LOGON EFETUADO COM SUCESSO !!!!”, caso contrário emitimos a mensgem “LOGON FALHOU, TENTE NOVAMENTE !!!”.

Na Listagem 6.2 temos o código para a criação da página proposta.

Listagem 6.2 – O primeiro exemplo de página ASP.NET – chap6ex1.aspx.

<html>

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

       public void  Botao_Click(Object  sender,EventArgs e)

            if  (Nome.Value == "user1" && Senha.Value ==  "senha123")

                        Message.InnerHtml = "LOGON  EFETUADO COM SUCESSO !!!!";

             else

                            Message.InnerHtml = "LOGON FALHOU,  TENTE NOVAMENTE !!!";

</script>

<body>

    <form method=post runat="server">

             <h3>Digite  o nome:

             <input  id="Nome" type=text size=40 runat="server">

             <h3>Digite a senha:

             <input  id="Senha" type=password size=40 runat="server">

                <input type=submit value="Enter"  OnServerClick="Botao_Click" runat="server">

              <h1>

                 <span id="Message" runat="server">  </span>

              </h1>

    </form>

</body>

</html>

Digite o código da Listagem 6.2 e salve o mesmo em um arquivo chamado chap6ex1.aspx, na pasta chap6, dentro da pasta wwwroot, conforme descrito anteriormente. Para acessar esta página utilize o seguinte endereço:

http://localhost/chap6/chap6ex1.aspx

Ao carregarmos esta página no Internet Explorer obtemos o resultado indicado na Figura 6.5

Curso Completo de ASP.NET - Júlio Battisti
Figura 6.5 O primeiro exemplo – chap6ex1.aspx.

Digite user1 para o nome e senha123 para a senha. Dê um clique no botão Enter. Você receberá uma mensagem dizendo que o logon foi efetuado com sucesso. Agora digite jose para o nome e senha123 para a senha. Dê um clique no botão Enter. Você receberá uma mensagem informando que o logon falhou e que você deve tentar novamente, conforme indicado na Figura 6.6.

Curso Completo de ASP.NET - Júlio Battisti
Figura 6.6 Utilizando o primeiro exemplo – chap6ex1.aspx.

Sem detalhar o código vamos comentar os principais componentes do nosso exemplo.

Criação da interface

Para criarmos a interface da página utilizamos alguns controles HTML chamados de “Controles HTML do Servidor – HTML Server Controls”. Observe o atributo runat=”server” destes controles, indicando que os mesmos são HTML Server Controls.

Por padrão, as tags HTML normais são tratadas como texto e não temos acesso às propriedades das mesmas, através de código. Com o uso de HTML Server Controls os controles HTML são tratados como elementos do servidor e podemos ter acesso a estes controles através de programação. No exemplo da Listagem 6.2 estamos acessando a propriedade Value dos controles Nome e Senha, para verificar os valores digitados pelo usuário. Não teríamos como acessar estas propriedades, utilizando os controles HTML tradicionais.

Por exemplo, para acessar o valor digitado no controle Nome, acessamos a propriedade Value deste controle, utilizando a seguinte sintaxe:

Nome.Value

Teremos um capítulo completo sobre HTML Server Controls – Capítulo 7.

Código para responder a um evento.

A lógica do exemplo da Listagem 6.2 pode ser resumida da seguinte maneira:

“Quando o usuário clica no botão Enter é disparado o evento Click deste botão, o qual dispara o código contido no procedimento Botao_Click. Na própria definição do controle indicamos o nome do procedimento e do evento, conforme indicado a seguir:

<input type=submit value="Enter"  OnServerClick="Botao_Click" runat="server">

O OnServerClick indica o evento “Ao Clicar”, o qual é disparado quando o usuário clica no botão. O valor atribuído a propriedade OnServerClick, que no nosso exemplo foi Botao_Click, define o nome do procedimento que será executado em resposta ao evento. Este evento pode estar na Seção de Código da página, que é o caso do nosso exemplo, ou pode estar em uma classe herdada, caso estejamos utilizando Code Behind, conforme descrito anteriormente.

A seção de código.

Na seção de código da página chap6ex1.asp, logo após a tag <html, temos o procedimento Botao_Click. Este procedimento está escrito em linguagem C#, conforme definido pela tag <script> no início da página:

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

No procedimento Botao_Click testamos os valores digitados pelo usuário nos campos Nome (Nome.Value) e Senha (Senha.Value). Dependendo dos valores utilizados retornamos uma ou outra mensagem. Observe que o código no procedimento Botao_Click é código C# padrão. Temos um teste if, no qual são feitos dois testes ligados pelo operador lógico AND (&&).

Na prática se estivéssemos criando um formulário para logon, o nosso evento Botao_Click deveria fazer conexão com um banco de dados ou com o Active Directory do Windows 2000, para verificar as credenciais fornecidas. Se o nome de usuário e senha estiver correto o acesso é liberado, caso contrário uma mensagem de erro é retornada para o usuário. Embora sem utilidade prática, o exemplo chap6ex1.aspx serve, didaticamente, para mostrarmos os HTML Server Controls em ação.

Em resumo acontece o seguinte:

1. A página chap6ex1.aspx é carregada.

2. O usuário preenche os campos Nome e Senha e dá um clique no botão Enter.

3. O evento Click do botão é disparado.

4. Em resposta ao evento Click, o procedimento Botao_Click é executado.

5. Dependendo dos valores digitados pelo usuário, uma ou outra mensagem será retornada.

Agora que apresentamos um exemplo bastante simples, apenas para começarmos com o ASP.NET, vamos ver um exemplo que faz conexão com um banco de dados do SQL Server 2000.