Não é feitiçaria, é Metodologia (essa foi de doer)! Este artigo contém informações de utilização do Ajax aliados ao JSP e MySQL. Devo advertir que não é meu objetivo ensinar JSP ou MySQL e que o principal foco deste artigo é o AJAX (Asynchronous JavaScript And XML) e seus recursos, como o XMLHttpRequest.
O que é o AJAX? Muitos desenvolvedores web já desejaram programar usando tal metodologia, mas não obtinham os conceitos necessários. Sim, o Ajax não é uma tecnologia ou linguagem de programação, mas uma metodologia na qual envolve tecnologias como JavaScript, XML e, obviamente, HTML.
O principal objetivo do Ajax é construir uma interação mais veloz e interativa com o usuário, bem como tornar dinâmico o uso do web site. Em outras palavras, o Ajax torna seu web site atraente e não usa métodos antigos de construções de páginas, como o REFRESH, fazendo com o que seu site fique nos moldes de uma aplicação desktop.
Quando interagimos com aplicativos baseados no Ajax, não precisamos esperar que a página se recarregue a cada interação que fazemos com ela. À medida que vamos utilizando seus recursos, a interface vai se moldando às nossas necessidades, baseando-se em nossas ações e requisições perante a ela.
Existem dois métodos de construção de web sites, o método tradicional e o método de construção usando o Ajax.
O método tradicional age assim: cada evento acionado pelo usuário (mouse, teclado, etc...) transforma-se em uma requisição HTTP, na qual uma nova página com os dados são requeridos no servidor. Este método antigo, faz com que o usuário espere por cada resposta do servidor, além de sobrecarregar a rede com dados desnecessários. Por exemplo, em uma página de inserção de dados, com formulário, uma nova requisição HTTP não seria necessário, caso o usuário desejasse inserir muitos registros. A página seria exatamente a mesma e, o método faria com que cada inserção requeresse a mesma página com o formulário novamente.
Já o método com Ajax tornaria a página mais dinâmica visto que, cada clique no botão "Inserir" enviaria somente os dados necessários, livrando o usuário de esperar o famoso REFRESH.
Abaixo temos duas ilustrações simplificando os dois esquemas:
Abaixo temos a performance da criança...
Bom, chega de lero-lero. Próximo passo: Construindo um formulário de inserção utilizando o Ajax.
[5] Comentário enviado por ls_junior em 05/03/2007 - 08:01h
Muito bom o artigo, a única observação é quanto a utilização do innerHTML, que não funciona em todos os browsers. A solução que eu uso é a seguinte:
var o = document.getElementById("exibeResultado"); // pega o objeto
var node = document.createTextNode("Inserindo"); // cria um novo no de texto
for(var cont = 0; cont < o.childNodes.length; cont++) {
o.removeChild(o.childNodes[cont]); // remove todo o conteudo do objeto
}
o.appendChild(node); // adiciona o novo texto ao objeto
[6] Comentário enviado por brejao em 05/03/2007 - 12:09h
valew ls_junior. essa eu não sabia.... pessoal obrigado pelos comentários..
fico feliz que meu artigo seja útil...
fernandobrito, não importa a lingua que use, seja ZOPE, PHP ou ASP, qualquer uma delas terá o mesmo efeito se substituir minha página de gravação JSP por outra que manuseie o banco de dados, inserindo os registros corretamente, de acordo com os parâmetros resgatados do AJAX.
:)
[9] Comentário enviado por girinoboy em 10/04/2007 - 17:38h
Esse artigo é o melhor q encontrei, junta 3 ferramentas 1 pouco dificil de c utilizar, vc esta de parabens obrigado por ter feito esse artigo, vc praticamente salvol a minha vida, pra vicar otimo so completando com uma consulta...
vlw msm esse artido é muito util e tem q ser + divulgado!!!!
[11] Comentário enviado por PHD em 16/07/2007 - 14:46h
Mt Bom o artigo...
só uma dica, na leitura do formulário para armazenar os dados você poderia simplificar por exemplo por...
Function Varre(id)
{
// onde id é o ID do Form
var dados = new Array();
for( i=0; i < document.getElementById(id).elements.length; i++)
{
var aux = encodeURIComponent(document.getElementById(id).elements[i].name);
aux += "=";
aux += encodeURIComponent(document.getElementById(id).elements[i].value);
dados.push(aux);
}
return dados.join("&");
}
...assim pegaria os valores mais facilmente...
mais uma vez mt bom o artigo...
flw
[12] Comentário enviado por juliak em 21/01/2008 - 16:36h
Cara, estou com um problema ao usar esse modelo para enviar dados ao servidor e ao banco de dados. O primeiro envio é efetuado sem problemas, mas se for enviar as mesmas informações novamente, a página não é enviada. É como se ela ficasse no cache no navegador, sem ser processada novamente pelo servidor.
Exemplo: o usuário faz o login com sucesso, porém ao deslogar não consegue logar novamente porque a página, a ser carregada assincronamente, não é solicitada novamente ao servidor.
Alguém sabe como me ajudar?
[14] Comentário enviado por jpraminelli em 21/09/2009 - 17:08h
como faço para que em caso de sucesso , ao invés de exibir uma mensagem jogar o usuario para uma outra pagina ?
o comando jsp - response.sendRedirect("inicio.jsp"); parou de funcionar., invés de direcionar para a pagina inicio.jsp, ele esta exibindo a paginda dentro da div ...
[15] Comentário enviado por ktinho em 06/12/2010 - 15:47h
ai voce entende bem de ajax parabens voce poderia me ajudar com meu trabalho ele esta postado nesse post eu sou novo no linux eu so preciso tirar algumas duvidas me da um help la o linkin do post e esse: