03 Janeiro 2006

Tutorial prototype -> Ajax.Updater

Eis uma ajuda pra quem nem conhece muito de programação.
Ajax.Updater é uma daquelas ferramentas que realmente ajudam nas atualizações de conteúdo em páginas de forma dinâmica e instantânea.
Imagina uma div numa página dessa maneira:
 
<div id="teste1"></div>
 
Agora vamos popular essa DIV com algum conteúdo fixo na página:
 
document.getElementById("teste1").innerHTML = "<b>Olá Mundo</b>";
 
Bom, acho que isso não deve ter nada de novo pra quem já programa em JavaScript ou que faz alguns Plus em DHTML.
Mas aí que está a diferença, você não vai precisar fazer nem isso se quiser atualizar o conteúdo de uma DIV via Ajax usando prototype.
Olhe como funciona essa função:
 
var myAjax = new Ajax.Updater("IDdaDIV", URL, {method:'get', parameters:pars});
 
pronto, a atualização é feita na DIV IDdaDIV pela URL informada. Complicado de entender? Então veja o exemplo completo:
 
<script src="prototype.js"></script>
<script>
    function pegaHTML(){
         var url = "http://www.lolados.com/ajax/exemplos/conteudo.htm";
         var pars = "";
        
         var meuAjax = new Ajax.Updater('conteudodinamico', url, {method: 'get',
                                                           parameters: pars});
    }
</script>
<input type="button" value="Carrega Conteúdo" onclick="pegaHTML()" />
<div id="conteudodinamico"></div>
 
E é isso..
simples não? Agora vocês podem fazer seus menuzinhos atualizaveis e outras coisas mais...
Vejam o exemplo que fiz: Exemplo 1

Comentários:
ae Cage....realmente o codigo ficou bem enxuto...to comecando a gostar do prototype....mas, vc poderia postar o arquivo "cargamenu.php" pra gente dar uma olhada como vc fez?
 
Olá .. estou começando a utilizar a biblioteca tmb.. tenho uma duvida.. vamos ver se você já passou por isso... Se na minha pagina de retorno no caso "conteudo.html" eu tenho uma tag "Script" a pagina retornada na div "conteudodinamico" retorna sem o conteudo da tag "script" ou seja os java scripts são retirados .. Existe alguma forma de isso não ocorrer? é normal?
valeu..
 
so pr etiqueta .. encontrei na documentação como retonar javascript no conteudo retornado... Basta acrescentar o parametro evalScripts:false.. abraço
 
Postar um comentário





<< Início

This page is powered by Blogger. Isn't yours?

Assinar Postagens [Atom]