Bruno C. de Paula
ASP.NET
Ajax
2º Semestre 2009 > PUCPR >
Tecnologia de Programação 2
Resumo da aula
O objetivo de hoje é conhecer os
componentes do ASP.NET que permitem
a implementação de recarregamento
parcial de uma página (Ajax).
Também conheceremos os
componentes ricos do toolkit ASP.NET
Ajax Toolkit.
Por fim, trabalharemos com a
integração de JavaScript com o
ASP.NET, também característica deste
framework;
Ajax
Asynchornous JavaScript And XML
Padrão de construção de páginas na
web;
A página é recarregada parcialmente
durante as requisições;
A recuperação é feita de maneira
assíncrona;
O que trafega do servidor ao cliente
é dado e não conteúdo;
05/11/2015
3
Com Ajax, a página é
parcialmente reconstruída
05/11/2015
4
Modelo clássico (síncrono)
05/11/2015
5
Modelo Ajax (assíncrono)
05/11/2015
6
Resposta do Servidor ao Cliente
é dado
05/11/2015
7
ASP.NET Ajax
http://ajax.asp.net
Framework da Microsoft para
implementação de Ajax;
Formado por 3 partes:
– ASP.NET Ajax Extensions (Server);
– ASP.NET Ajax Control Toolkit;
– ASP.NET Ajax Library / jQuery
(Client);
05/11/2015
8
ASP.NET Ajax Extensions
Já instalado no Visual Studio 2008;
Transformam código “não-Ajax” em
Ajax (“ajaxificação”);
05/11/2015
9
ScriptManager
Modifica o comportamento do
postback do cliente;
Todas as páginas que vão trabalhar
com Ajax devem possuir um
ScriptManager;
Já existe um modelo pronto de web
form com ScriptManager;
05/11/2015
10
Chamando métodos de servidor
via Ajax
O ScriptManager também permite que
se chame métodos do servidor via
JavaScript;
Propriedade
EnablePageMethods=true;
Útil para integrar sistemas JS com
ASP.NET.
05/11/2015
11
UpdatePanel
Marca os componentes que poderão
sofrer atualização parcial;
Dentro de um UpdatePanel vão os
componentes “ajaxificados”;
Só colocar UpdatePanel no que se
deseja ajaxificar;
05/11/2015
12
Exemplo UpdatePanel
05/11/2015
13
Só o botão é recarregado!
05/11/2015
14
Timer
Chama uma função no servidor de
tempos em tempos;
Trabalhar com o evento Tick;
Não usar em excesso;
Utilidade:
– Chat;
– Atualizações em tempo real;
– Jogos.
05/11/2015
15
UpdateProgress
Visualização a ser mostrada enquanto a
página estiver carregando;
“Acalma” o usuário;
Ícone ou mensagem de carregamento;
Prefira colocar ícones Ajax:
– http://www.ajaxload.info/
05/11/2015
16
ScriptManagerProxy
O ScriptManager pode ser colocado na
MasterPage;
ScriptManagerProxy deve ser
colocado em uma página de conteúdo,
se já existir ScriptManager na Master;
05/11/2015
17
ASP.NET Ajax Toolkit
Dezenas de controles ricos;
Open Source e desenvolvido pela
comunidade;
Diversos bugs, cuidado!
Alguns controles utilizam a metáfora de
extenders:
– Controle que melhora as
características já existentes de
outro.
05/11/2015
18
Modificação de comportamento
via extender
Cada controle pode ter associado um
ou mais extenders;
05/11/2015
19
Propriedade TargetControlId
indica a associação
05/11/2015
20
O componente ganha novas
propriedades
05/11/2015
21
Conheça os controles!
http://ajax.asp.net
05/11/2015
22
Passo a passo:
Download e Instalação
05/11/2015
23
Download
http://ajax.asp.net
05/11/2015
24
Download
05/11/2015
25
Download
05/11/2015
26
Download
05/11/2015
27
Download
05/11/2015
28
Download
05/11/2015
29
Download
DLL AjaxControlToolkit.dll contém os
controles;
05/11/2015
30
Instalação na Toolbox
Criar uma nova aba na ToolBox;
05/11/2015
31
Instalação na Toolbox
Dar um nome significativo para a
aba;
05/11/2015
32
Instalação na Toolbox
Selecionar a aba e a opção Choose
Items...
05/11/2015
33
Instalação na Toolbox
05/11/2015
34
Instalação na Toolbox
Selecionar a DLL do ControlToolkit;
05/11/2015
35
Instalação na Toolbox
Selecionar os controles desejados;
05/11/2015
36
Ok! Você está
pronto para usar
os controles!
05/11/2015
37
Mais referências
 ASP.NET Ajax e AjaxToolkit : Coisas que você não vai
achar no manual:
– http://www.bufaloinfo.com.br/ExibeNoticias.aspx?
entryid=4365006300388332816
 Vídeos:
– http://www.asp.net/learn/ajax-videos/
 Tutoriais:
– http://www.asp.net/learn/ajax/