Atualizando Páginas com Ajax
Alguem ai ja tentou atualizar parte de uma página atraves do Ajax?
Existe uma forma fácil de fazer este trabalho utilizando a biblioteca JavaScript Prototype.
Primeiramente crie um diretório com a sua aplicação. Neste diretório coloque os arquivos prototype.js e effects.js. Estes arquivos vc pode fazer o download direto do site do projeto prototype.
Depois crie a página com o seguinte código:
<head>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="effects.js"></script>
<script type="text/javascript">
function navega( page )
{
new Ajax.Updater('body', page , {
method: 'get',
onFailure: function() { Element.classNames( 'body' ).add( 'failure' ) },
onComplete: function() { new Effect.BlindDown( 'body' , { duration: 1 } ) }
});
}
</script>
</head>
<body>
<div id="principal">
<a href="teste.html" onclick="navega('teste.html'); return false">teste</a>
</br>
<a href="teste2.html" onclick="navega('teste2.html'); return false">teste2</a>
</br>
<div id="body"></div>
</div>
</body>
</html>
Bem, acima vcs podem ver que o script JavaScript recebe como parâmetro a página a ser acessada. O conteúdo da página a ser acessada será renderizado somente na div body.
É bem simples e fácil, qualquer dúvida mande um contato.
Obs.: No código acima as tags html possui um ponto no inicio da tag, ignore elas. Elas foram colocadas pelo fato do plugin deste post não permitir a inclusão de código como texto.
Até mais!
November 1st, 2007 at 10:13 am
Valeu Fred …rs… me ajudou e lembrou aqui no trabalho!
…rs…
June 7th, 2008 at 10:59 am
Cara valew, mesmo ! Esta ajudando a matar bichaos de 7 cabeças
June 7th, 2008 at 2:32 pm
E ai Vilson… tudo bom?
Kra que legal heim!
Se eu puder ajudar é só avisar…
valeu! _o/