Carregando HTML usando o DWR

Um método bem simples e muito interessante do DWR é o forwardToString(“JSP/HTML”). Você tem mais ou menos o seguinte cenário:

Você deseja carregar uma determinada página ou trecho de código que está salvo em um html ou jsp dentro da sua aplicação e quer que essa página seja carregada em um deterninado local, normalmente uma DIV, TBODY. Veja como é simples:

Vamos inicialmente criar no seu FacadeAjax um método que irá receber uma determinada URL e vai devolver essa requisição como HTML puro. Veja o código abaixo:

Agora vamos fazer o JavaScript que irá executar esse método:

O que ele basicamente faz é fazer a chamada ao método carregaPagina passando como parâmetro a página que você deseja carregar e no retorno dessa chamada(callback) ele carrega a página na tela utilizando o DWRUtil.setValue(). Observe que no DWRUtil.setValue() eu passo mais um parâmetro que é o: escapeHtml:false, que vai evitar que o browser carregue o código html no lugar do resultado. Sem esse parâmetro ele iria mostrar as tag do html.

HTML

No HTML passado acima temos apenas um input onde deverá conter a página que você deseja carregar e uma tabela com um link que executará a função do JavaScript. Temos abaixo desse link a tag TBODY que é onde vamos carregar o nosso html.

Queremos carregar o restante dessa tabela(no nosso exemplo estamos carregando um trecho de uma tabela, mas poderá ser uma completa ou outra coisa que você deseje), que poderá ter vários conteúdos, ou seja, poderá ter um ou mais arquivos html como o que está abaixo:

TESTE.HTML

Observe abaixo passo a passo a sua execução:

Agora passamos como parâmetro a página teste.html descrita anteriormente:

Clicamos no link Carregar Página:

Você observou como é simples carregar html na sua aplicação usando o DWR. Lembrando que aqui foi apenas um exemplo, imagine ter uma determinada funcionalidade que o usuário através de uma Combo seleciona um de vários formulários já prontos. Seria algo como um formulário “dinâmico”.

Fica a cargo da sua criatividade utilizar essa funcionalidade do DWR. No exemplo da Palestra do Sun Tech Days utilizo esse método para carregar alguns formulários na tela, mas não é obrigado serem somente formulários, podem ser tabelas, imagens etc.

Mas informações no link abaixo:

http://getahead.org/dwr/server/generic

Espero que este artigo tenha sido de utilidade.

Abraços

Be Sociable, Share!
Publicado em AJAX, DWR Marcado com: , ,
18 comentários sobre “Carregando HTML usando o DWR
  1. usando os outrs frameworks tem como fazer isso de forma simples tambem, se alguem estiver usando o Ext, pode fazer assim:
    Ext.get(‘id_objeto’).load(
    {
    url:’pagina.html’,

    });
    E assim por diante…

  2. handersonbf disse:

    Boa milfont, mas o foco dessa funcionadade não é somente carregar um html, ou uma página, ele pode ser utilizado para outras coisas bem mais avançadas. A integração com o Ext como vc sabe é show de bola. Mas se o cara não tem o Ext no projeto e só o DWR, o DWR lhe permite fazer isso, mesmo ele tendo os dois, dependendo do objetivo da funcionalidade as vezes sai mais simples fazer com o DWR. Mas foi uma ótima dica tbm, já tinha visto isso dele.
    Ai no caso vc colocou somente um trechinho neh ;P tbm não é só isso nao rsrsr mas vlw. Mas ele é simples tbm como o DWR.

    abraços e vlw

  3. Rafael Ponte disse:

    Ficou muito bom, e o melhor, é muito útil :)) Esse lance de criar um formulário ou página via JavaScript é coisa de “maxu” e de quem gosta de “mexer no cimento” 😛

    Parabéns.

  4. Ivan Carlos disse:

    Concordo com o Rafael… Handersom e vc é o maior dentre os Mestre de Obras.

  5. handersonbf disse:

    Rafael Ponte.
    Pois rafael tem coisas que fazer 100% no Javascript não compensa mesmo, o DWR facilita nisso, mas depende do projeto. Vlw

    Ivan
    Meu amigo atrofiadoman, rsrs você não entendeu o que o Rafael falou. Outra coisa, tenta fazer isso ai com JSF ;D ou tenta fazer o que a signatures faz com o DWR no JSF ;D tem coisas que da para usar o JSF, mas tem muito mais que não da para usar ele. Não sou mestre de obras, sou PROGRAMADOR ;D.

    É engraçado que a galera do JSF tem esse pensamento rsrsr quero ver um sistema completo com ele, usando técnicas de WEB2.0 lembrando que fazer uma tela sem reloader não é WEB2.0. E antes que você esqueça o JSF usa o javascript na maioria dos componentes dele ;D. você que não usa, pois usa os componentes dele, é como o struts 2 fez com o DWR, embutiu ele e usa componentes para acessar eles.

    Não desmereço o JSF, mas também não vamos ser atrofiados não é, achando que fazer js é mexer no cimento, putz, então você também mexe no cimento já que digita código JAVA e ?

    Quero alguém fazer só 10% do que já fiz ou que o Christiano Milfont por exemplo já fez com o “cimento” rsrsrs da nem pro caldo o JSF ;D mas cada caso é um caso, cada um tem suas facilidades e serventias e os dois podem trabalhar juntos, por isso o DWR também tem integração com JSF ;D

    Abraços e vlw

  6. handersonbf disse:

    Ah antes que gere confusão por causa do “atrofiadoman” quero deixar aqui bem claro que o Ivan é um grande amigo meu, por isso tenho intimidade de bricar com ele, não pensem que tentei ofender ele ok? ;D Ele sabe que é brincadeira.

    abraços e vlw Ivan.

  7. Anderson disse:

    obrigado por dar de bandeja um negocio q eu estava matutando como fazer 😀

  8. handersonbf disse:

    hauhauahauh que bom Anderson ter sido útil ;D legal saber que pude ajudar.

    abraços

  9. Carlos Atila disse:

    Cara muito massa isso, continue postando artigo de otima qualidade. Parabéns!!

  10. É muito bom saber que para desenvolvimento web existe um excelente framework AJAX que atende todas as espectativas do programador em relação ao uso dessa tecnologia. Parabéns por disseminar essa tecnologia na internet de uma forma clara e sucinta.

  11. handersonbf disse:

    Atila
    Obrigado cara e continue acompanhando tbm ;D

    Carneiro
    Vlw cara bom saber que estou agradando meu “público”.
    Abraços

  12. Anizair disse:

    Handerson estou utilizando o DWR para fazer uma tela de login, mas estou com algumas dúvidas tem como você desenvolver um tutorial de crianção de uma tela de login para clarear minha cabeça.
    Este tutorial que você colocou está show de bola …
    Sem mais para o momento obrigado..

  13. ok entendi disse:

    muito bom o tutorial

  14. hulk disse:

    adorei, vc podia por mais coisas sobre como construir

  15. handersonbf disse:

    @ok entendi
    Obrigado….ok entendi rsrsrs O_o

    @Eduardo
    Obrigado, mas o que seria essas mais coisas ?
    Bem estou meio sem tempo de postar, já estou a um tempinho sem postar nada 🙁 mas estou fazendo o possível para quando conseguir tempo colocar aqui mais assuntos interessantes, o site não morreu ;D em breve mais artigos aqui.

    Abraços

  16. I every time spent my half an hour to read this website抯 articles or reviews every day along with a mug of coffee.

  17. Jefferson disse:

    Handerson, você é muito bom, isso foi ótimo eu estava precisando desta solução.

  18. Olá Jefferson, muito obrigado amigo. Que bom que pude te ajudar 🙂 abraços!

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

*

Categorias

Calendário

junho 2017
S T Q Q S S D
« fev    
 1234
567891011
12131415161718
19202122232425
2627282930