Escolar Documentos
Profissional Documentos
Cultura Documentos
beforeSend complete
data
Se usa para especificar datos a mandar. Estos tienen la siguiente forma: foo=bar&foo2=bar2;. Si los datos a enviar son un vector(array) jQuery los convierte a varios valores con un mismo nombre (si foo["alt1","alt2"], foo="alt1"&foo="alt2";)
Indica el tipo de datos que se van a llamar. Si no se especifica jQuery automticamente encontrar el tipo basado en el header del archivo llamado (pero toma mas tiempo en cargar, as que especifcalo )
dataType
"xml": Devuelve un documento XML. "html": Devuelve HTML con texto plano, y respeta las etiquetas. "script": Evalua el JavaScript y devuelve texto plano. "json": Evalua la respuesta JSON y devuelve un objeto Javascript
Parmetros error
Explicacin Se ejecuta si ocurre un error al llamar el archivo. Devuelve 3 parametros: El objeto, un string con el error, y un objeto adicional de error, si este ocurre. Permite hacer que el objeto ajax obedezca o desobedezca las reglas para objetos ajax que el usuario pone. Permite ejecutar cdigo al ser exitoso un llamado Permite definir un tiempo de espera antes de ejecutar un objeto ajax. Indica el mtodo que se va a usar
global
Funcin: Recibe los datos que fueron llamados Funcin: Recibe los datos que fueron llamados "GET" o "POST"
url
$.ajax({ url: "introduccion-a-jquery.htm", async:true, Funcin Antes de beforeSend: function(objeto){ Ejecutarse alert("Adis, me voy a ejecutar"); }, complete: function(objeto, exito){ Se ejecuta siempre alert("Me acabo de completar") if(exito=="success"){ alert("Y con xito"); Codificacin } }, contentType: "application/x-www-form-urlencoded", dataType: "html", Tipo de retorno error: function(objeto, quepaso, otroobj){ alert("Estas viendo esto por que fall"); alert("Pas lo siguiente: "+quepaso); }, Error global: true, success: function(datos){ alert(datos); }, Si esta todo ok. timeout: 3000, type: "GET" Tiempo de espera y });
mtodo de envo.
Consideracion
Problemas El problema ms frecuente que ocurre con ajax es cuando se trata de cargar por este una pagina de otro servidor. Por cuestiones de seguridad, algunos navegadores no permiten la ejecucin de este tipo de llamados. Sin embargo, hay tcnicas (hacks) que se pueden usar para usar ajax cross-domain.
<div class="trigger">Trigger</div> <div class="result"></div> <div class="log"></div> Podemos atachar nuestro manejador de eventos (event handler) a cualquier elemento $('.log').ajaxComplete(function() { $(this).text('Triggered ajaxComplete handler.'); }); Ahora podemos crear un request Ajax usando cualquier metodo Jquery $('.trigger').click(function() { $('.result').load('ajax/test.html'); });
DEMO
Obs:Se diferencia con AjaxStop ya que este ultimo se ejecuta cuando todas las peticiones se terminan
$("#feeds").load("feeds.php", {limit: 25}, function(){ alert("Se Cargaron los 25 ultimos feed"); });
$.ajax({ url: url, data: data, success: success, dataType: dataType });
Cuando la funcin callback es existosa se pasa los datos devueltos, que pueden ser un XML, un texto String, un archivo JS o un objeto JSON dependiendo del tipo MIME de la respuesta $.get('ajax/test.html', function(data) { $('.result').html(data); alert(La carga se realiz.'); }); Ejemplos $.get("test.php", { name: "John", time: "2pm" } ); $.get("test.php", function(data){alert("Data Loaded: " + data);});
Carga datos desde el servido usando HTTP GET Request y que estn codificados en formato JSON. Es un atajo para la funcin:
$.ajax({ url: url, dataType: json, data: data, success: callback }); Una implementacin ms precisa sera $.getJSON('ajax/test.json', function(data) { var items = []; $.each(data, function(key, val) { items.push('<li id="' + key + '">' + val + '</li>'); }); $('<ul/>', { 'class': 'my-new-list', html: items.join('') }).appendTo('body'); }); Y la estructura JSON {
INTRODUCCIN A JSON
Agenda
JSON
1. 2. 3. Introduccin Estructuras Formas de representacin A. Clases B. Propiedades C. Arrays 4. Configuracin e Inicializacin 5. Utilizacin A. eval B. Prototipe
PARTE TERICA
www.JSON.org
INTRODUCCIN EL PROBLEMA
Los desarrolladores necesitan enviar y recibir datos de manera sencilla pero utilizando un formato comn para estructuras complejas. Se han desarrollado muchas soluciones ad-hoc donde se separan un conjunto de valores separados por comas, puntos y comas u otros separadores pero de serializacin y des-serializacin complicadas. Hay que evitar tener que construir parsers cada vez que queremos intercambiar mensajes con el servidor.
INTRODUCCIN JSON
JSON : Independiente de un lenguaje especfico Basado en texto De Formato ligero Fcil de parsear NO Define funciones NO tiene espacios de nombres (Namespaces) NO tiene validator NO es extensible
INTRODUCCIN JSON
Lenguajes que lo soportan: ActionScript C / C++ .NET (C#, VB.NET) Delphi Java JavaScript Perl PHP Python Ruby Etc
FORMAS DE REPRESENTACION
Sirve para representar objetos en el lado de cliente, normalmente en aplicaciones RIA (Rich Internet Application) que utilizan JavaScript. Object.- Conjunto desordenado de pares nombre/valor Array.- Coleccin ordenada de valores Value.- Puede ser un string, nmero, booleano, objeto u array String.- Coleccin de cero o ms caracteres unicode. Number.- Valor numrico sin comillas
FORMAS DE REPRESENTACION
Descripcin simplificada Ejemplo
FORMA DE ARRAY
Coleccin ordenada de valores u objetos Notacin Empieza con un corchete izquierdo [ Termina con un corchete derecho ] Los valores se separan con una coma ,
FORMA DE ARRAY
[ { country: New Zealand, population: 3993817, animals: [sheep, kiwi] } , { country: Singapore, population: 4353893, animals: [merlion, tiger] } ]
FORMA DE VALUE
Puede ser Una cadena de caracteres con comillas dobles Un nmero True, false, null Un objeto Un array
FORMA DE STRING
Coleccin de cero a mas caracteres Unicode encerrados entre comillas dobles Los caracteres de escape utilizan la barra invertida Es parecida a una cadena de caracteres en C o Java.
FORMA DE NUMBER
Similar a los numeros de C o Java No usa formato octal o hexadecimal No puede ser NaN o Infinity, en su lugar se usa null. Puede representar Integer Real Scientific
CODIFICACIN DE CARACTERES
Estrictamente UNICODE Por defecto es UTF-8 UTF-16 y UTF-32 tambin estan permitidos.
FORMA DE VALUE
[ { country: New Zealand, population: 3993817, animals: [sheep, kiwi] } , Objeto { country: Singapore, population: 4353893, animals: [merlion, tiger] } ]
String
Number
Array
OTRAS FORMAS
Boolean -> true / false null
... <persona>
<nombre>Juan</nombre>
<apellidos>Palomo</apellidos> <fecha>10/10/1980</fecha> </persona> ...
... <listado> <persona> <nombre>Juan</nombre> <apellidos>Palomo</apellidos> <fecha>10/10/1980</fecha> </persona> <persona> <nombre>Juan</nombre> <apellidos>Palomo</apellidos> <fecha>10/10/1980</fecha> </persona> </listado> ...
... var myJSONObject = {"listado": [ { "nombre": "Juan", "apellidos": "Palomo", "fecha": "10/10/1980" }, { "nombre": "Juan", "apellidos": "Palomo", "fecha": "10/10/1980" } ] }; ...
YAML
Acrnimo de Yet Another Markup LanguageArray Es un subconjunto de JSON, con ms capacidades Listas, casting, etc No maneja caracteres unicode de escape JSON puede ser parseado por los parsers de YAML Hay que tenerlo en cuenta cuando JSON no sea suficiente para nuestras necesidades.
JSON - UTILIZACIN
Mediante Librerias ( Por ejemplo en JavaScript ) Transformacin de cadenas de texto a objetos Transformacin de objetos a cadenas de texto Personalizacin de las transformaciones
JQUERY
Puede recuperar datos en formato JSON API
jQuery.parseJSON( json ) jQuery.getJSON( url, [ data ], [ callback(data, textStatus, xhr) ] )