Bom, apresentei hoje um tutorial sobre
Grails![[bb]](http://boo-box.com/bbli)
(os
slides são os mesmos utilizados para a apresentação na FACENSA no ano passado sobre Grails também), o Exemplo de código pronto eu vou colocar aqui durante a semana pois vou mudar o servidor do blog e ja copiei todos os arquivos para o server novo
Mas o último exemplo que eu quis fazer não funcionou, era um exemplo de como fazer Paginação via AJAX no grails utilizando Javascript não com o lowpro, parecido com o que eu comentei no post sobre lowpro para o rails.
Cheguei em casa e fui tentar descobrir por que a coisa não funcionou, e foi mais fácil do que eu esperava.
Não funcionou por que eu esqueci que os templates padrão do Grails não utilizam IDs nas DIVs, por tanto o AjaxUpdater criado não funcionava …
Para fazer o exemplo funcionar é só fazer o seguinte:
copiar o lowpro.js para a pasta web-app/js
editar o template padrão (grails-app/views/layouts/main.gsp) e fazer ele ficar parecido com o seguinte:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| <html>
<head>
<title><g:layoutTitle default="Grails" /></title>
<link rel="stylesheet" href="${createLinkTo(dir:'css',file:'main.css')}" />
<link rel="shortcut icon" href="${createLinkTo(dir:'images',file:'favicon.ico')}" type="image/x-icon" />
<g:layoutHead />
<g:javascript library="prototype/prototype" />
<g:javascript library="lowpro" />
<g:javascript library="application" />
</head>
<body>
<div id="spinner" class="spinner" style="display:none;">
<img src="${createLinkTo(dir:'images',file:'spinner.gif')}" alt="Spinner" />
</div>
<div class="logo"><img src="${createLinkTo(dir:'images',file:'grails_logo.jpg')}" alt="Grails" /></div>
<div id="content">
<g:layoutBody />
<div>
</body>
</html> |
Basicamente as alterações são:
Nas linhas 7 e 8 onde adicionei as bibliotecas lowpro e prototype
e mais importante, nas linhas 16 e 18 onde coloquei uma DIV com ID “content” em volta do conteúdo da página (isto vocês podem ajustar para envolver apenas o conteúdo que vocês quiserem).
Depois editando o application.js (web-app/js/application.js)
1
2
3
4
| Event.addBehavior.reassignAfterAjax = true;
Event.addBehavior({
'a.step':Remote.Link({update:'content'})
}) |
Apenas adicionei estas linhas no final do arquivo, a primeira configura o lowpro para reaplicar os comportamentos no final das chamadas AJAX, e as outras adicionam o comportamento de link AJAX em todas as tags “A” com a classe “step” que é o que o grails utiliza na paginaçao.
Agora a parte chata, no rails ele ja entende isto automaticamente, mas no grails eu tive que fazer na unha mesmo (nem é tanto trabalho assim )
Vamos editar o metodo “list” do controller de clientes (ou qualquer controller do grails que vocês quiserem )
1
2
3
4
5
6
| if(!params.max) params.max = 10
if(request.getHeader("X-Requested-With")=="XMLHttpRequest"){
render template:'listcontent', model:[clienteList: Cliente.list( params )]
}else{
return [ clienteList: Cliente.list( params ) ]
} |
A diferença básica é que se o cabeçalho X-Requested-With disser que é uma requisição AJAX eu vou retornar apenas a parte da página que me interessa (OK, isto eu teria que fazer no rails também, mas o rails iria me retornar toda a página se eu não fizesse isto, o grails não retorna nada )
e para isto funcionar precisamos editar a view também …
eu copiei todo o conteúdo da tag body da view “list.gsp” para o arquivo “_listcontent.gsp” (precisei criar o arquivo), e na list.gsp eu coloquei no body apenas a linha: ${render(template:’listcontent’)}
Ou seja, substitui todo o conteúdo do body por esta linha, assim posso renderizar tudo em um request padrão, e apenas o conteúdo da página em um request AJAX.
Pronto, agora a paginação do Grails esta funcionando via AJAX
esta semana eu atualizo este post com o link para o zip do exemplo completo, mas apenas com isto vocês ja devem conseguir fazer a paginação via AJAX
PS.: não esqueçam para utilizar todos os recursos do Grails é interessante saber bem groovy (a linguagem utilizada), spring, GORM (hibernate) e sitemesh que são os frameworks utilizados por traz dos panos.
Se você gostou deste post, lembre-se de assinar o RSS feed do blog, para ser notificado de novos posts!
