Apresentação j query6

download Apresentação j query6

If you can't read please download the document

Transcript of Apresentação j query6

Funes Utilitrias para trabalhar com Ajax

- Ajax uma sigla para Asynchronous JavaScript and XML

- Basicamente um mtodo ou conjunto de mtodos para comunicao com o servidor sem a necessidade de recarregamento da pgina.

$.ajax( settings )

async

cache

complete

data

dataType

error

success

timeout

type

url

Inicia uma solicitao Ajax usando as opes passadas

Async: padrao trueCache: padrao true se for false fora a pgina a no fazer cache.Complete: funcao chamada na finalizacao da requisicao.Data: passar o parametros a serem processados na solicitacao.DataType: Tipo de dado que esperado como retorno pela resposta (xml, json, html, text)Error: funcao chamada se a requisicao falharSuccess: funcao chamada quando a requisicao obtiver sucessoTimeout: para definir o tempo limite da requisicaoType: tipo da requisicao (GET ou POST). Se omitido GETUrl a url da solicitacao ajax:

$.ajax({url: url,dataType: 'JSON',cache: false, async: false,data: {nome: Red, cidade: Caucaia},success: function(obterDados) {if (obterDados.achou == true){alert(Cidado procurado, traz o saco 02);}else{alert(Cidado de bem, pode liberar);} },error: function() {alert(No foi possvel localizar este possvel meliante);}});

$.ajaxSetup(properties)

Estabelece um conjunto de propriedades passadas como os padroes para chamadas Ajax subsequentes.

$.ajaxSetup({ type: 'POST', timeout: 5000, dataType: 'JSON' });

$.ajax({ data: parametros }, function(resposta){...});

$.ajax({type: 'POST', timeout: 5000,dataType: 'JSON' data: parametros }, function(resposta){...});

Serve para estabelecer um conjunto padrao de propriedades para as chamadas ajax subsequentes.

Se alguma solicitacao ajax subsequente definir alguma opo que j estiver sido definida na funcao ajaxSetup, para essa requisicao em particular vale a propriedade definida na funcao ajax.

Pode-se colocar o ajax setup em qualquer ponto da pgina, mas comumente colocada dentro da funcao ready da pgina.

$.load(url, parameters, callback)

Carrega a resposta da requisio no elemento coincidente

$('#result').load( 'arquivo-html.html');

$('#result').load('arquivo-html.html #fragmentoHTML');

$('#result').load('arquivo.jsp', { 'cidades[]': ['Caucaia', 'So Bernardo'] });

$('#result').load('arquivo.json', callback(){});

A requisio padro para trfego de dados GET, contudo caso sejam passados parmetros adicionais a requisio torna-se POST.

$.get(url, parameters, callback)Executa uma requisio GET para a URL informada.

$.post(url, parameters, callback)
Executa uma requisio POST na URL informada.

$.getJSON(url, parameters, callback)
Executa uma requisio GET com expectativa de retorno de um JSON.

$.getJSON(url,function(retorno){...});

$.ajax({ url: url, dataType: 'json', data: data, success: function(retorno){...});});

Mtodos Ajax de convenincia

==

So chamados mtodos ajax de conveniencia

So encapsulamentos do metodo ajax

Vem com algumas opes pre-selecionadas do ajax

a=1&b=2&c=3&d=4&e=5

$.serialize()

Transforma os dados do formulrio em uma string de requisio

4

56 7

a=1&b=2&c=3&d=4&e=5

Serve para serializar os dados do formulrio

Serializa em forma de String

[ { name : 'campo1', value : 123 }, { name : 'campo2', value : 'ol mundo!' } ]

Transforma os dados do formulrio em um objeto array chave/valor

$.serializeArray()

[ {name: a , value: 1}, {name: b , value: 2}, {name: c , value: 3}, {name: d , value: 4}, {name: e , value: 5} ]

Devolve um objeto no formato chave/valor

Funes Globais Ajax

So funes que permitem associar eventos do Ajax nos elementos coincidentes

$().ajaxStart(callback)

$().ajaxSend(callback)

$().ajaxSuccess(callback)

$().ajaxError(callback)

$().ajaxComplete(callback)

$().ajaxStop(callback)

Start quando a chamada ajax iniciadaSend Na hora que a requisicao estiver sendo mandada ao serivdorSuccess depois que a solicitacao foi devolvida do servidor com cdigo de sucessoError codigo de erroComplete depois que a solicitacao foi devolvida do servidor e que as funcoes de sucesso e erro forem invocadasStop executada depois que todo o processamento ajax est completo.

Obrigado!