JQUERYAjax

O que é AJAX ? AJAX - Asynchronous JavaScript and XML E um conjunto de técnicas que tem

como objetivo carregar e enviar informações de um servidor de aplicação sem a necessidade de recarregar a página inteira.

Aplicações web que utilizam ajax: gmail, google, facebook entre outros.

Jquery e AJAX Jquery implementa diversos métodos do

ajax, e possível trocar dados em diversos formatos: HTML, XML ou JSON de um servidor remoto.

E pode diretamente alimentar os elementos de tela com o retorno da informação.

Sem jquery a implementação do AJAX e complicada e precisa de muitas linhas de codigo.

Método load() O método LOAD carrega dados de um

servidor remoto e pode alimentar algum objeto de tela.

$(selector).load(URL,data,callback);

URL – Caminho da página que contém os dados

DATA – dados enviado como parametroCALLBACK – função para ser chamada posteriormente

Exemplo Fonte de dados demo.txt :<h2>teste de jquery</h2><p id=“p1”>Um paragrafo</p1>

Utilizando o metodo load:$("#div1").load("demo_test.txt");

Exemplo Carregando o elemento através do

seletor$("#div1").load("demo_test.txt #p1");

Método load() com callback O callback e opcional e é executado

quando a ação e finalizada, como o ajax depende de uma conexão assíncrona, isto e útil pois permite a correta utilização, recebe tres parametros: responseTxt – contem o resultado da

chamada. statusTxt – contem o status. xhr - contem o objeto XMLHttpRequest.

Método load() com callback $("button").click(function(){  $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){    if(statusTxt=="success")      alert("External content loaded successfully!");    if(statusTxt=="error")      alert("Error: "+xhr.status+": "+xhr.statusText);  });});

Método Get() e Post() São métodos que são utilizados para

trocar dados do servidor: GET - solicita dados de um recurso

especifico. POST - envia dados para um recurso

externo. Basicamente GET receberá dados de um

determinado recurso e pode ser cacheado.

Post também e utilizado para enviar e receber dados de um servidor, porem os dados de retorno NUNCA serão cacheados.

Metodo $.get() Sintaxe:

$.get(URL,callback); Exemplo:$("button").click(function(){  $.get("demo_test.asp",

function(data,status){    alert("Data: " + data + "\nStatus: " + status);  });});

Metodo $.post() Sintaxe:

$.post(URL,data,callback); Exemplo:

$("button").click(function(){  $.post("demo_test_post.asp",  {    name:"Donald Duck",    city:"Duckburg"  },  function(data,status){    alert("Data: " + data + "\nStatus: " + status);  });});