O documento discute o framework AJAX DWR, incluindo: 1) Uma introdução ao DWR como uma biblioteca Java e JavaScript que facilita o acesso a métodos Java do lado do cliente; 2) Os primeiros passos para usar o DWR, como baixar as bibliotecas, configurar o servlet e dwr.xml, e criar classes Java e páginas; 3) Como usar o modo de depuração do DWR e a biblioteca util.js para manipular tabelas e listas.

1. Treinamento AJAX
Waelson Negreiros
Email: waelson@gmail.com
Blog: http://waelson.com.br

2. Agenda
O
que DWR?
 Primeiros Passos
 Modo Debug
 Biblioteca Utils.js
 JSON
 Exercício

3. O que é DWR?
 Framework
Open Source;
 Blibliotecas Java e JavaScript;
 Oculta a complexidade;
 Acessa métodos em classes Java;
 Java Script mais fácil.

4. O que é DWR?

5. O que é DWR?
 Está

Parte Server-Side



dividido em duas partes:
Servlet Java rodando no servidor;
Processa as requisições e retorna ao DWR;
Parte Client-Side

DWR encapsula o XMLHttpRequest

6. O que é DWR?
 Falicidade




de uso
DWR cria os JavaScript para acesso ao Java;
Código personalizado para cada classe Java;
Conversão automática de parâmetros;
Comunicação assíncrona via XMLHttpRequest.

7. Primeiros Passos
 Baixe
a biblioteca do site
www.directwebremoting.org
 Crie um projeto Java Web e coloque todas as
blibliotecas na pasta WEB-INF/lib
 Mapei o servlet do DWR no web.xml;
 Crie o arquivo dwr.xml no diretório WEB-INF
 Crie sua classe Java e registre no dwr.xml
 Crie sua página, adicione os scripts gerado
pelo DWR e invoque os métodos Java.

8. Primeiros Passos
 WEB.XML

9. Primeiros Passos
 DWR.XML

Define as classes e métodos que serão
disponibilizados para acesso do lado cliente.

10. Primeiros Passos
 Classes
Java

11. Primeiros Passos
 DWR.XML

12. Primeiros Passos
 Chamadas
dos script gerados pelo DWR

13. Primeiros Passos
 JavaScript

14. Primeiros Passos
 Teste
sua aplicação através da URL abaixo
http://localhost:8080/<my_app>
EXEMPLO

15. Primeiros Passos

16. Modo Debug
 Permite
você testar as chamadas aos
métodos Java;
 URL http://localhost:8080/<my_app>/dwr
 Modo deve está habilitado no web.xml

17. Modo Debug

18. Modo Debug

19. Biblioteca Utils.js
 Facilita
o desenvolvimento JavaScript;
 Métodos auxiliares para manipulação de:


Tabelas
Listas

20. Biblioteca Utils.js
 Principais





Funções:
$(id) – Retorna um objeto
getValue(id) - Retorna o valor de um objeto
getText(id) – Retorna o texto de listas (option)
setValue(id, valor) – Configura um valor em um
objeto
setValues([notação Json]) – Configura o valor
em mais de um objeto

21. Biblioteca Utils.js
 Principais




Funções
addOptions(id, array) – Adiciona vários options
a um select
addRows(id, array, cellfuncs, [options]) –
Preenche uma tabela;
removeAllOptions(id) – remove todos os options
ou ul de um objeto;
removeAllRows(id) – remove todas as linhas de
uma tabela

22. JSON
 Acrônimo
de JavaScript Object Notation;
 Usado para troca de dados;
 Alternativa aos XMLs;
 Construído sobre 2 estruturas


Coleção de pares nome:valor;
Lista de valores ordenado

23. JSON

24. JSON
 Exemplo:
var pessoa = {
nome: ”Waelson Negreiros”,
cpf: “92007279304”
};

25. Exercício
 Com
base no que foi ensinado construa uma
simples aplicação que ao clicar em um
botão, retorne a data e hora dos servidor e a
exibe em um textarea.