desenvolvimento de software para internet · • python • rpg • ruby • ... metadescription...

66
DESENVOLVIMENTO DE SOFTWARE PARA INTERNET 1 terça-feira, 28 de agosto de 12

Upload: duongtuong

Post on 29-Oct-2018

220 views

Category:

Documents


1 download

TRANSCRIPT

DESENVOLVIMENTO DE SOFTWARE PARA INTERNET

1

terça-feira, 28 de agosto de 12

INTRODUÇÃO AO .NET FRAMEWORK

2

terça-feira, 28 de agosto de 12

PLATAFORMA .NET

• Conjunto rico de bibliotecas com os mais variados usos• Facilidade de desenvolvimento de aplicações desde as mais simples até as mais

complexas• Facilidade na instalação e na distribuição de aplicações• Orientada a objetos• Interoperabilidade entre plataformas e componentes desenvolvidos em coutra

linguagens .NET• Sintonizado com as últimas tecnologias• Tecnologia baseada em máquina virtual• Rotina automática de “coleta de lixo” que permite remoção de variáveis e

objetos que não são mais utilizados3

terça-feira, 28 de agosto de 12

PLATAFORMA .NET

A plataforma .NET é executada sobre uma Common Language Runtime - CLR (Ambiente de Execução Independente de Linguagem) interagindo com um Conjunto de Bibliotecas Unificadas (framework). Esta CLR é capaz de executar, atualmente, mais de 33 diferentes linguagens de programação, interagindo entre si como se fossem uma única linguagem.

• APL• Boo• Clarion• COBOL• Component Pascal• C♯• C++• F♯• Eiffel• Forth• Fortran

• Haskell• Java• JScript• J♯• Lua• Mercury• Piet• Oberon• Object Pascal / Delphi

Language• Oz

• Pascal• Perl• PowerBuilder• PowerShell• Python• RPG• Ruby• Scheme• SmallTalk• Standard ML• Visual Basic• xBase

4

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

• Baseado na plataforma .NET• Gratuito• Necessário para executar as aplicações .NET

5

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

.NET Framework

Class Library

ADO .NET

Web Services

Common Language Runtime (CLR)

Windows

Data Types

AplicaçõesVB .NET

AplicaçõesC#

AplicaçõesC++

Código da Plataforma

6

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

CLR - Compilação e Execução

MSIL(Microsft Intermediate

Language)

Antes da instalação ou a primeira vez que cada método é chamado

7

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

Visão Geral da Compilação

Código Fonte

Código Gerenciável

8

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

9

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

10

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

11

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

12

terça-feira, 28 de agosto de 12

.NET FRAMEWORK

13

terça-feira, 28 de agosto de 12

INTRODUÇÃO AO ASP.NET

14

terça-feira, 28 de agosto de 12

INTRODUÇÃO AO ASP .NET

Desenvolvimento de web Sites dinâmicosParte do .NET FrameworkUtiliza web server controls para construir layouts complexos com mínimo esforço

Exemplo de controles•Controles de validação•Controle de login (recuperar e alterar senha)•Controle de navegação•Controles para exibição de dados (GridView, DataList, DetailsView, FormView, Repeater, Chart e ListView)•Imagens, Tabelas, Marcadores, XML, Calendários•Buttons, TextBox, CheckBox, RadioButton, Label

15

terça-feira, 28 de agosto de 12

INTRODUÇÃO AO ASP .NET

BENEFÍCIOS DE UM CÓDIGO COMPILADO:

• Desempenho• Segurança• Estabilidade e Interoperabilidade

No momento de compilar para gerar as DLLs, o código é otimizado para o respectivo processador, reduzindo o overhead em tempo de execução.

A plataforma .NET permite que códigos programados em diferentes linguagens (como C# e VB.NET) sejam utilizados no mesmo projeto.

16

terça-feira, 28 de agosto de 12

CRIANDO UM WEBSITE ASP.NET

• No Visual Studio 2010, acessar File, e em seguida, New Web Site...

• Definir o tipo de projeto, a localização do projeto, e a linguagem de programação desejada.• Clique em Ok.

17

Novo website

terça-feira, 28 de agosto de 12

CRIANDO UM WEBSITE ASP.NET

O Visual Studio 2010 possui três modos de visualização principais: Split (dividido), Source e Design.O modo Source contém o código HTML e as declarações dos web server controls, enquanto o modo de visualização Design possui a aparência real da aplicação. O modo Split exibe o modo Source e Design na mesma tela.

18

Modo de visualização Source Modo de visualização Design

terça-feira, 28 de agosto de 12

CRIANDO UM WEBSITE ASP.NET

No menu View é possível acessar diversas janelas que auxiliaram no desenvolvimento dentro do Visual Studio. As 3 mais utilizadas são: Toolbox, Properties Windows e Solution Explorer.A janela Toolbox exibe todos os componentes disponíveis para o projeto. Estes componentes podem ser adicionados ao modo Design com arraster e soltar.

19

Adicionando um novo controle a página web

terça-feira, 28 de agosto de 12

CRIANDO UM WEBSITE ASP.NET

A janela Properties permite exibir e alterar as propriedades, comportamento e aparência de controles, forumlários ou páginas.A janela Solution Explorer exibe os diretórios e arquivos que pazem parte da aplicação web. Nela também é possível adicionar novos itens, como uma nova página, um documento XML, uma classe ou arquivo de texto, etc.

20

Janela de propriedades do controle Janela Solution Explorer

terça-feira, 28 de agosto de 12

CRIANDO UM WEBSITE ASP.NET

Para testar a página de um projeto, acesse View in Browser no menu File, ou a partir da janela Solution Explorer. Se preferir, use o atalho na barra de ferramentas. Outra forma é usando as opções do menu Build e, em seguida, acessar a página, ou seja, digitando a URL no navegador, usando o diretório virtual correspondente à página.

21

Testando a página a partir do Solution Explorer Página Exibida

terça-feira, 28 de agosto de 12

SINTAXE DO ASP.NETAssim como o HTML, o ASP.NET também utiliza elementos HTML, código JavaScript e elementos CSS, porém as páginas HTML são limitadas quanto à funcionalidade.Uma página ASP.NET pode ser criada apenas renomeando um arquivo HTML de .html para .aspx.Elementos que diferenciam uma página ASP.NET de uma página HTML estática:• Extensões (.aspx para ASP.NET)• Diretivas opcionais, como @ Page, @ Assembly, etc• O elemento form• Web server controls• Código executado no servidor

22

Exemplo de uma página ASP.NET

terça-feira, 28 de agosto de 12

O ELEMENTO FORM

23

O elemento form é requerido somente em páginas que contêm controles cujo valor será usado durante o processamento. Esse elemento tem controles que o usuário utiliza para interagir com a página ou enviar informações. Ao usá-lo, devemos observar as seguintes regras:• Somente um elemento form por página. Deve estar dentro das tags <html> e <body>

• Os server controls devem ser colocados dentro do elemento form.• Não devemos usar o atributo action do elemento form, pois ele é definido de forma

dinâmica pelo ASP.NET• O atributo runat do elemento form deve ser definido como server

terça-feira, 28 de agosto de 12

CÓDIGO EXECUTADO NO SERVIDOR

24

O ASP.NET pode conter código que é executado no servidor quando a página é processada. As principais linguagens usadas por esse código são: C# e Visual Basic.Há duas formas de se rodar o código no servidor com ASP.NET.A primeira usa o elemento script e inclui o atributo runat=”server”, geralmente chamadas de script-block;A segunda inclui o código em uma página separada e associa a página ASP.NET por meio da diretiva @ Page. Esse modo de codificação é chamado de code-behind. Exemplo:

terça-feira, 28 de agosto de 12

DIRETIVAS

25

A principal função das diretivas é passar informações para a págna ASP.NET e definir propriedades. As informações passadas para a página pelas diretivas influenciam diretamente o modo como a página é processada no servidor.

A principal diretiva usada por uma página ASP.NET é @ Page, a qual desempenha as seguintes funções:• Configurar a linguagem de programação usada pelo código executado no servidor.• Ativa e desativa o buffer da página• Fornece a informação referente à localização do arquivo que contém o código da página• Contém informações sobre a classe usada pela página, sobre o estado da página, sobre o idioma

usado, etc.

ASP.NET trata qualquer diretiva de bloco (<%@ %>) que não contém um nome de diretiva explícito como uma diretiva @ Page (para uma página) ou

como uma diretiva @ Control (para um controle de usuário ).

terça-feira, 28 de agosto de 12

DIRETIVAS

26

Diretiva Descrição

@ Assembly Associa um assembly à página atual.

@ Control Define informações para um user control.

@ Implements Define a interface implementada pela página ou pelo user control.

@ Import Importa, de forma explícita, namespaces usadas na página ou no user control.

@ Master Define a página como sendo uma Master Page e os atributos usados pela página.

@ WebHandler Define atributo para arquivos HTTP hablder (.ashx).

@ PreviousPageType Contém informações sobre página e tipo, posteriormente acessadas pela propriedade PreviousPage.

@ MasterType Cria uma referência para as propriedades públicas declaradas na Master Page. As Propriedades públicas da Master Page são acessadas por intermédio da propriedade Master.

@ MasterType Define as políticas de cache usadas pela página ou pelo user control.

@ Page Define atributos usados pela página ASP.NET.

@ Reference Indica o user control ou o arquivo com código que deve ser dinamicamente compilado.

@ Register Cria uma associação entre o prefixo de uma tag e um custom control.

Lista de diretivas que podem ser usadas em uma página ASP.NET, master page ou user control.

terça-feira, 28 de agosto de 12

DIRETIVAS

27

Atributos DescriçãoLanguage Linguagem de programação usada pela página ASP.NET

EnableViewState Ativa e desativa o estado de visualização dos controles usados na página.

MasterPageFile Contém o nome do arquivo master page.

CodeFile Define o nome do arquivo que contém o código C# da página.

Inherits Define o nome da classe usada pela página.

MetaDescription Contém os metacaracteres que descrevem a página.

MetaKeywords Contém os termos relacionados à página, geralmente usados por mecanismos de busca.

Theme Define o arquivo de tema usado.

Os principais membros da diretiva @ Page são:

Exemplo:

terça-feira, 28 de agosto de 12

WEB SERVER CONTROLS

28

Podemos adicionar a uma página ASP.NET, web server controls que são processados no servidor. Esses controles se parecem com os botões HTML inseridos pelo elemento input e sua principal função é a interação com o usuário. Além disso, podem ser manipulados pelo código que é executado no servdor. Exemplo:

O nome da tag usado por um server control utiliza o prefixo asp:. Tags que têm prefixos diferentes não fazem aprte do .NET Framework. Além disso, um ASP.NET web server control tem o atributo runat=”server” e um identificador (atributo ID).Também podemos definir eventos para controles e páginas, por exemplo quando o usuário clica em um controle do tipo Button.

terça-feira, 28 de agosto de 12

WEB SERVER CONTROLS

29

O método Page_Load é executado no momento em qe a página web é carregada. Geralmente, o evento Load é usado para verificar se determinada página já foi postada e também para inicializar variáveis, campos, parâmetros, etc. A propriedade IsPostBack pode ser usada para verificar se é a primeira vez que a página está sendo carregada (postada) pelo usuário. Exemplo:

terça-feira, 28 de agosto de 12

WEB SERVER CONTROLS

30

Para abrir a janelde código e adicionar eventos, dê um duplo clique no formulário ou controle. nesse caso, o evento padrão é adicionado. Para acrescenter outros eventos, clica-se no botão Eventos na janela de propriedades do controle.

Eventos do controle Button

terça-feira, 28 de agosto de 12

MODELO DE CODIFICAÇÃO

31

Uma página ASP.NET é dividida em duas partes: uma contendo os elementos visuais da página, como controles, imagens, textos, marcações HTML; outra que contém a lógica da página, ou seja, o código que é executado quando um usuário clica no botão de umformulário ou realiza qualquer outra ação.O ASP.NET tem dois modelos de codificação: em arquivo único, chamado script-block, e outro chamado code-behind. No modelo de arquivo único, todo o código fica na mesma página, sejam os elementos HTML, código executado no servidor, imagens, texto etc. O código que é executado no servidor fica dentro do elemento scirpt com o atributo runat=”server”:

terça-feira, 28 de agosto de 12

MODELO DE CODIFICAÇÃO

32

O modelo chamado code-behind separa o código do design, ou seja, os elementos HTML, imagens, textos, server controls ficam na página com a extensão .aspx; e o código que interage com os server controls (executado no servidor), por sua vez, é colocado em uma página com a extensão .cs.

A extensão que contém o código executado no servidor pode variar de acordo com a linguagem usada. C# utiliza a extensão .cs, e o Visual Basic, a

extensão .vb.

terça-feira, 28 de agosto de 12

MODELO DE CODIFICAÇÃO

33

Arquivo codebehind.aspx:

Arquivo codebehind.aspx.cs:

terça-feira, 28 de agosto de 12

MODELO DE CODIFICAÇÃO

34

A palavra-chave partial indica que somente parte da classe _Default está no arquivo Deafult.aspx.cs. Isso ocorre em função de que, quando a página é compilada, o ASP.NET gera uma nova classe parcial contendo as declarações dos controles incluídos na página. A classe-base da página deve ser a classe Page ou qualquer outra classe derivada dela. A partir da classe Page, podemos fazer verificações ou obter informações sobre a página em execução. A linha a seguir verifica se a página já foi carregada anteriormente:

if (Page.IsPostBack)Para testar o exemplo, coloque ambos arquivos na mesma pasta e execute a página no navegador.

Página ASP.NET com code-behind

terça-feira, 28 de agosto de 12

CÓDIGO VINCULADO

35

Outra possibilidade é vincular o código diretamente na página.É importante ressaltar que vincular o código C# diretamente não é a melhor opção em projetos complexos, pois dificulta a depuração e a manutenção do código.O código vinculado é útil quando precisamos realizar cálculose definir valores para um controle ou marcação HTML. Exemplo:

terça-feira, 28 de agosto de 12

CÓDIGO VINCULADO

36

O trecho de código <% = expressão %> é usado para retornar o valor da expressão.O exemplo anterior pode ser escrito da seguinte forma:

terça-feira, 28 de agosto de 12

XHTML E ASP.NET

37

XHTML é um padrão criado pela W#C (World Wide Web Consortium) que define a HTML como um documento XML. Por padrão, todas as marcações produzidas pelo ASP.NET e pelos web server controls utilizam o padrão XHTML 1.0 Transitional.

Os principais tipos de XHTML são: • XHTML 1.0 Transitional• XHTML 1.0 Frameset• XHTML 1.0 Strict• XHTML 1.1.

As principais vantagens da XHTML:• Garante elementos bem formados.• Garante a consistência das páginas em diferentes navegadores.• XHTML é extensível, permite a definição de novos elementos.

terça-feira, 28 de agosto de 12

DIFERENÇAS ENTRE XHTML E HTML

38

A diferença entre essas duas linguagens de marcação está basicamente no modo como elementos e atributos devem ser inseridos na página ASP.NET. A XHTML é mais rígida, tem regras mais claras para diferentes elementos da página. A seguir, temos as principais regras impostas pela XHTML:

• Todos os elementos precisam ser explicitamente fechados.• Os nomes da tag e dos atributos são exibidos em letras minúsculas, e os valores dos

atributos devem estar entre aspas duplas.• A formatação das páginas é realizada apenas com CSS (Cascading Style Sheet).• Os scripts devem utilizar o atributo type. Exemplo: type=”text/javascript”.• Todos os blocos de script gerados pelo ASP.NET são exibidos dentro de comentários HTML

terça-feira, 28 de agosto de 12

DEFININDO UMA PÁGINA ASP.NET COM XHTML

39

Por padrão, o Visual Studio 2010 gera páginas compatíveis com o padrão XHTML 1.0 Transitional.

Quando adicionamos uma nova página ASP.NET, basicamente dois novos elementos são requiridos pela XHTML: a declaração DOCTYPE:

e o elemento html contendo uma referência para a namespace XHTML:

terça-feira, 28 de agosto de 12

DEFININDO UMA PÁGINA ASP.NET COM XHTML

40

A seguir, temos um exemplo simples que está em conformidade com as regras da XHTML:

terça-feira, 28 de agosto de 12

A ESTRUTURA DE UM WEBSITE

41

Um website tem diversos tipos de arquivos, Além disso, podemos criar diretórios com propósitos específicos, por exemplo, um diretório que contém imagens, outro com o código-fonte, etc. É interessante que vocêorganize os arquivos em uma árvore de diretórios divididos de acordo com a natureza ou a funcionalidade de cada um.O ASP.NET reconhece certos tipos de diretórios cujo conteúdo é predefinido, por exemplo o diretório Bin contém os assemblies (DLLs) do website.Lista de diretórios reservados usados pelo ASP.NET:

Diretórios Descrição

App_Browsers Contém os arquivos com a extensão .browser. Os arquivos .browser gerenciam as informações sobre os recursos implementados pelo navegador.

App_Code Contém o código-fonte da aplicação. Exemplo: arquivos .cs, .vb.

App_Data Contém os arquivos dos banco de dados (.MDF, .MDB), documentos XML.

App_GlobalResources Contém os arquivos de recursos global (.resx e .resources). Esses arquivos contêm imagens, textos, arquivos, etc.

App_LocalResources Contém o arquivo de recursos local (.resx e .reources). Esses arquivos contêm imagens, textos, arquivos, etc.

App_Themes Contém os arquivos .skin e .css responsáveis pela aparência da aplicação.

App_WebReferences Contém os arquivos usados pelos web services. Extensão: .wsdl, .xsd, .disco, .discomap.

Bin Contém os assemblies da aplicação (.dll).

terça-feira, 28 de agosto de 12

A ESTRUTURA DE UM WEBSITE

42

Além dos diretórios e arquivos, o website tem uma página-padrão que é executada sempre que alguém digita a URL principal, sem especificar uma página. Exemplo quando digitamos:

http://www.meusite.com.br

a página-padrão default.aspx é executada:

http://www.meusite.com.br/default.aspx

Página-padrão pode ser uma página .aspx, .asp, .htm, .html ou outra página qualquer, desde que esteja configurada no servidor IIS.

Uma aplicação ASP.NET armazena as configurações do website no arquivo web.config, o qual é colocado na raiz da aplicação. Além do arquivo web.config, o arquivo Global.asax, opcional, é colocado na raiz da aplicação web, sendo utilizado para manipular eventos ligados à aplicação.

terça-feira, 28 de agosto de 12

APPLICATION CONTEXT

43

Quando uma aplicação web é utilizada por um usuário, o ASP.NET mantém informações sobre diferentes aspectos da aplicação, como sessões de cada usuário, requisições e respostas enviadas pelo servidor, etc. O ASP.NET tem diversas classes que possibilitam manipular e extrair essas informações, e as classes podem ser acessadas por objetos intrínsecos.

Objeto Classe ASP.NET Descrição

Response HttpResponseEncapsula informações sobre a resposta da requisição HTTP gerada pela operação

ASP.NET. Com essa classe, é possível gravar cookies, escrever informações na tela, entre outras funções.

Request HttpRequest Essa classe permite acessar informações sobre a requisição, como ler cookies, headers, query string etc.

Context HttpContextFornece acesso ao contexto atual inteiro, inclui todos os outros objetos (Response, Request, Server, Application, Session, Trace). Esse objeto é usado para compartilhar

informações entre páginas.

Server HttpServerUtility Essa classe pode ser usada para transferir o controle entre páginas, codificar e decodificar marcações HTML e extrair informações sobre os erros mais recentes.

Application HttpApplicationState Permite manipular o estado da aplicação.

Session HttpSessionState Permite manipular o estado de sessão do ASP.NET

Trace TraceContext Exibe mensagens de rastreamento sobre a página web exibida.

terça-feira, 28 de agosto de 12

OBJETO RESPONSE

44

Encapsula informações sobre a resposta da requisição HTTP gerada pela operação ASP.NET. Por exemplo, podemos exibir informações na tela com o método Write:

Response.Write(“Isto é um teste.</br>”);

Response.Write(“Este texto é exibido na segunda linha.”);

Ou gravar um cookie com a propriedade Cookies:

Response.Cookies[“Nome”].Value = “Alfredo”;

Ou simplesmente redirecionar um usuário para outra página ou website:

Response.Redirect(“http://www.unip.br”, false);

terça-feira, 28 de agosto de 12

OBJETO REQUEST

45

Permite acessar informações sobre a requisição. Exemplo, para acessar as informações sobre a URL e o caminho da página atualmente em execução, use:

Response.Write(“Path = “ + Request.Path + “<br>”);Response.Write(“PathInfo = “ + Request.PathInfo + “<br>”);Response.Write (“PhysicalApplicationPath = “ + Request.PhysicalApplicationPath + “<br>”);Response.Write(“PhysicalPath = “ + Request.PhysicaPath + “<br>”);Response.Write(“RawUrl = “ + Request.RawUrl + “<br>”);Response.Write(“Url = ” + Request.Url);

A propriedade UrlReferrer retorna a URL da página web que enviou o visitante para o seu website:

Response.Write(“Request.UrlReferrer = ” + request.UrlReferrer);

Enquanto a propriedade UserAgent exibe informações sobre o tipo de navegador e o sistema operacional utilizado:

Response.Write(“Request.UserAgent = ” + Request.UserAgent);

terça-feira, 28 de agosto de 12

OBJETO REQUEST

46

A propriedade UserLanguages retorna um array contendo o nome do idioma para o qual o sistema operacional está configurado:

Response.Write(“Request.Languages = ” + Request.UserLanguages[0]);

Para acessar o conteúdo de campo de formulário, use na página de destino:

Response.Write(Request.Form[“txtNome”]);

Para verificar se um navegador suporta cookies ou JavaScript, use:

HttpBrowserCapabilities bc = Request.Browser;

Response.Write(“Suporta Cookies = ” + bc.Cookies + “<br>”);

Response.Write(“Suporta JavaScript = ” + bc.JavaScript);

terça-feira, 28 de agosto de 12

OBJETO SERVER

47

O método HtmlEncode do objeto Server exibe todas as strings como texto no navegador, de modo que nenhuma marcação HTML ou código JavaScript seja interpretado.

Response.Write(Server.HtmlEncode(“<b>Isto é um teste</b>”));

Retorno: <b>Isto é um teste</b>

O método HtmlDecode faz justamente o contrário do método HtmlEncode, que é decodificar uma string. Importante lembrar que, para decodificar uma string, ela deve estar codificada.

string mensagem = “<b>Isto é um teste</b>”;

Response.Write(Server.HtmlDecode(mensagem));

Exibe a frase anterior em negrito: Isto é um teste

terça-feira, 28 de agosto de 12

OBJETO SERVER

48

O método HtmlEncode codifica uma URL. A codificação de URLs é útil quando precisamos preservar caracteres especiais e espaços em branco de uma URL.

URL: http://unip.br?campus=Chacara Santo Antonio

Depois do método UrlEncode: http%3a%2f%2fwww.unip.br%3fcampus%3dChacara+Santo+Antonio

Caso uma URL já esteja codificada, podemos utilizar o método UrlDecode para decodificá-la:

Response.Write(Server.UrlDecode(“http%3a%2f%2fwww.unip.br%3fcampus%3dChacara+Santo+Antonio”));

Depois do método UrlDecode: http://unip.br?campus=Chacara Santo Antonio

O método MapPath retorna um diretório físico que corresponde a um diretório virtual no servidor web:

Response.Write(Server.MapPath(“nomedoarquivo.aspx”));

Response.Write(Server.MapPath(“../nomedoarquivo.aspx”));

terça-feira, 28 de agosto de 12

OBJETO CONTEXT

49

Este objeto é muito usado em classes que não herdam explicitamente os membros da classe Page. Exemplo: não é possível invocar o método Write do objeto Response em uma classe que não herda os membros da classe Page. A classe HttpContext fornece acesso ao contexto atual inteiro e inclui todos os outros objetos (Response, Request, Server, Application, Session, Trace).

Em seguida devemos compilar a classe e colocar a DLL resultante no diretório Bin.

terça-feira, 28 de agosto de 12

OBJETO CONTEXT

50

Invocar o método Executar usando uma instância da classe Class1:

terça-feira, 28 de agosto de 12

JAVASCRIPT E ASP.NET

51

O JavaScript interage diretamente com o navegador; o ASP.NET, em contraposição, não pode responder diretamente para o navegador, pois é preciso que a página seja enviada para o servidor antes de poder manipular ações. O JavaScript é uma linguagem interpretada, ou seja, o código é executado quando a página ASP.NET ou HTML é carregada no navegador. A sintaxe usada pela linguagem JavaScript é muito parecida com o C#.

Sintaxe JavaScript:

Sintaxe C#:

É possível utilizar outras linguagens de script em uma página ASP.NET, por exemplo, JScript (padrão), VBScript.

terça-feira, 28 de agosto de 12

JAVASCRIPT E ASP.NET

52

Uma linguagem de script pode ser utilizada para:• Ler e gravar cookies.• Verificar a versão do navegador e do sistema operacional do usuário.• Exibir imagens de forma aleatória.• Capturar o movimento do mouse sobre links e textos de uma página.• Modificar a aparência da página HTML ou ASP.NET.• Redirecionar o usuário para outras páginas e websites.• Navegar pelas páginas, entre outras funções.

Diversos web server controls geram automaticamente código JavaScript que realiza tarefas específicas no cliente. O controle LinkButton utiliza JavaScript para redirecionar o usuário para o link definido na propriedade PostBackUrl.

terça-feira, 28 de agosto de 12

JAVASCRIPT E ASP.NET

53

Código JavaScript gerado automaticamente pelo ASP.NET para o controle LinkButton:

terça-feira, 28 de agosto de 12

JAVASCRIPT E ASP.NET

54

Podemos usar o JavaScript de forma direta, incluindo o código diretamente na página, com o HTML.

Arquivo javascriptdireto.aspx

Arquivo javascriptdireto.aspx.cs

terça-feira, 28 de agosto de 12

JAVASCRIPT E ASP.NET

55

Podemos adicionar eventos em um server control. Esses eventos executam o código no cliente, geralmente, o código JavaScript. A linha a seguir muda o texto da barra de status do navegador quando o usuário move o mouse sobre um controle do tipo Image:

É possível declarar funções e usá-las em eventos do server control:

O código que muda a barra de status do navegador é declarado dentro de funções:

terça-feira, 28 de agosto de 12

JAVASCRIPT E ASP.NET

56

Quando usamos os server controls Button, LinkButton e ImageButton, podemos definir o atributo OnClientClick com o código JavaScript que será executado no cliente.

Observe que o controle nomeado como btnTestar tem dois eventos: OnClick, que executa o código no servidor, e OnClientClick, que executa código direto no navegador via JavaScript. O código executado no cliente solicita a confirmação da ação do usuário, sendo que o código do evento OnClick é executado após a confirmação do usuário.

terça-feira, 28 de agosto de 12

IDENTIFICANDO SERVER CONTROLS NO CLIENTE

57

É possível criar uma referência para um server control a partir de um script executado no cliente. Por exemplo, quando declaramos uma TextBox:

<asp:textbox id=”TextBox1” runat=”server”/>

o server control, depois de ser interpretado pelo navegador, resulta na seguinte declaração:

<input name=”TextBox1” type=”text” id=”TextBox1”/>

Assim é possível criar uma referência no código JavaScript:

<script type=”text/javascript”>

document.forms[0].TextBox1.value = “texto aqui”;

</script>

terça-feira, 28 de agosto de 12

IDENTIFICANDO SERVER CONTROLS NO CLIENTE

58

Os ASP.NET Web server controls incluem as seguintes propriedades de identificação: ID, UniqueID, ClienteID.ID é o identificador definido na propriedade ID de um controle.UniqueID é um identificador único gerado em tempo de execução pelo ASP.NET.ClientID é o identificador usado por linguagens de script para interagir com os server controls da página ASP.NET.

A propriedade ClientIDMode determina qual algoritmo deve ser usado para gerar o valor da propriedade ClientID. Podemos definir a propriedade ClientIDMode como: AutoID, Static, Predictable, Inherit.

Por exemplo, quando usamos um controle Label embutido em um controle ListView:

terça-feira, 28 de agosto de 12

IDENTIFICANDO SERVER CONTROLS NO CLIENTE

59

ClientIDMode = AutoID• ClientID: ListView1_ctrl0_ProductNameLabel• ClientID: ListView1_ctrl1_ProductNameLabel

ClientIDMode = Inherit• ClientID: ListView1_ProductNameLabel_1• ClientID: ListView1_ProductNameLabel_34

ClientIDMode = Predictable• ClientID: ListView1_ProductNameLabel_1• ClientID: ListView1_ProductNameLabel_34

ClienteIDMode = Static• ClientID: ProductNameLabel• ClientID: ProductNameLabel

Os valores gerados para a propriedade ClientID podem ser acessados por linguagem de script:<script type=”text/javascript”>

document.write(document.forms[0].ListView1_ProductNameLabel_43.value);</script>

terça-feira, 28 de agosto de 12

ADICIONANDO CÓDIGO JAVASCRIPT DE FORMA DINÂMICA

60

Em algumas situações, precisamos criar o código JavaScript de forma dinâmica com base em parâmetros disponíveis apenas no servidor. Assim, utilizamos classes do .NET Framework para construir blocos de código que serão executados no cliente, via linguagens de script.

Métodos Descrição

RegisterClientScriptBlock Adiciona o script ao topo da página.

RegisterClientScriptInclude Adiciona uma referência para um arquivo .js.

RegisterStartupScript O script adicionado com esse método é invocado depois de a página ser carregada, mas antes de o evento onload da página ser executado.

RegisterOnSubmitStatement O script adicionado é executado em resposta ao evento onsubmit.

Todos esses métodos oferecem um tipo com qual o script é associado e uma chave que evita duplicações desnecessárias. Podemos testar se um determinado bloco de código existe usando os métodos:

• IsClientScriptBlockRegistered• IsClientScriptIncludeRegistered• IsOnSubmitStatementRegistered• IsStartupScriptRegistered

terça-feira, 28 de agosto de 12

ADICIONANDO CÓDIGO JAVASCRIPT DE FORMA DINÂMICA

61

Neste primeiro exemplo, usaremos o método RegisterClientScriptBlock para criar as famosas janelas pop-ups. Como o script é adicionado ao topo da página, não podemos acessar campos de um formulário, pois o script é emitido antes do elemento <form>:

A propriedade IsPostBack verifica se a página já foi postada. O primeiro argumento do método RegisterClientScriptBlock é definido como:

this.GetType()

terça-feira, 28 de agosto de 12

ADICIONANDO CÓDIGO JAVASCRIPT DE FORMA DINÂMICA

62

A chave única foi nomeada como popup. O terceiro argumento do método RegisterClientScriptBlock tem o script que deve ser executado no navegador:

RegisterClientScriptBlock é adicionado ao topo da página e, em virtude disso, não pode acessar os elementos de um formulário, mas o método RegisterStartupScript emite o script após o elemento </form>. Dessa forma, é possível interagir com os campos de um formulário. Por exemplo, podemos controlar qual campo está ativado, ou seja, com o foco.O trecho de código a seguir contém um server control do tipo TextBox denominado TextBox1:

terça-feira, 28 de agosto de 12

ADICIONANDO CÓDIGO JAVASCRIPT DE FORMA DINÂMICA

63

Podemos ativar esse server control adicionando o código a seguir ao método Page_Load da página ASP.NET, o qual contém a declaração anterior :

O nome do campo do formulário que recebe o foco é definido com a seguinte instrução:

terça-feira, 28 de agosto de 12

ADICIONANDO CÓDIGO JAVASCRIPT DE FORMA DINÂMICA

64

Ao contrário dos métodos RegisterClientScriptBlock e RegisterStartupScript, o método RegisterOnSubmitStatement está associado ao evento onsubmit. Dessa forma, podemos exibir uma mensagem de confirmação para o usuário, igual à mensagem do exemplo com o evento OnClientClick:

terça-feira, 28 de agosto de 12

DEFININDO ATRIBUTOS

65

É possível definir atributos para um server control e adicionarmos o código JavaScript diretamente ao controle. Exemplo:

Quando o server control Button1 for clicado, uma mensagem de alerta será exibida.

terça-feira, 28 de agosto de 12

BIBLIOGRAFIA

• Centro para Iniciantes Microsoft: http://msdn.microsoft.com/pt-br/beginner/default.aspx• Como Programar com ASP.NET e C# - Alfredo Lotar - novatec• Desenvolvendo para Web usando o Visual Studio 2008 - Ramon Durães - novatec

66

terça-feira, 28 de agosto de 12