Carregar apresentação
A apresentação está carregando. Por favor, espere
1
Jquery Ajax
2
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.
3
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.
4
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 parametro CALLBACK – função para ser chamada posteriormente
5
Exemplo Fonte de dados demo.txt : Utilizando o metodo load:
<h2>teste de jquery</h2> <p id=“p1”>Um paragrafo</p1> Utilizando o metodo load: $("#div1").load("demo_test.txt");
6
Exemplo Carregando o elemento através do seletor
$("#div1").load("demo_test.txt #p1");
7
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.
8
Método load() com callback
$("button").click(function(){ $("#div1").load("demo_test.txt",functio n(responseTxt,statusTxt,xhr){ if(statusTxt=="success") alert("External content loaded successfully!"); if(statusTxt=="error") alert("Error: "+xhr.status+": "+xhr.statusText); }); });
9
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.
10
Metodo $.get() Sintaxe: Exemplo: $.get(URL,callback);
$("button").click(function(){ $.get("demo_test.asp", function(data,status){ alert("Data: " + data + "\nStatus: " + status); }); });
11
Metodo $.post() Sintaxe: Exemplo: $.post(URL,data,callback);
$("button").click(function(){ $.post("demo_test_post.asp", { name:"Donald Duck", city:"Duckburg" }, function(data,status){ alert("Data: " + data + "\nStatus: " + status); }); });
Apresentações semelhantes
© 2024 SlidePlayer.com.br Inc.
All rights reserved.