Apuntes y trucos de programación

Con las mootools es muy fácil usar ajax sin necesidad de manejar el objeto XmlHttpRequest y complicarse con las compatibilidades de los navegadores. Este ejemplo es el envio de un formulario, tan sencillo como formulario.send(); Ahí va el código: <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Insert title here</title> <script type="text/javascript" src="js/mootools/mootools-1.2.1-core-yc.js"></script> <style> /* los colores son muy mejorables */ .formulario { display: block; border: 0.1em solid green; background-color: #777070; color: #ffffff; font-size: 0.7em; } .formulario label { ...

Una forma más elegante de crear el objeto AJAX. La condición if (window.XMLHttpRequest) es la forma mostrada en los otros ejemplos. En cambio esta de la function AJAX me gusta más. <script language="javascript"> // Documento JavaScript // llamamos a que se recarge el contenido del div con ese id_contenedor // mediante la llamada a la url function mostrarNuevoContenido(url, id_contenedor) { var Ajax = new AJAX(url, id_contenedor); } // todo es correcto y ha llegado el momento de poner la información requerida // en su sitio en la pagina xhtml function cargarpagina (pagina_requerida, id_contenedor) { if (pagina_requerida.readyState == 4 && (pagina_requerida.status == 200 || window.location.href.indexOf ("http") == - 1)) document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText; } function AJAX(url, id_contenedor) { try { // Si es Mozilla, Safari etc XMLHttp = new XMLHttpRequest (); } catch (e...

Continuando con AJAX, estas funciones nos permiten trabajar con AJAX tanto por el método GET como por el POST. function Ajax() { var XMLHttp = false; if (window.XMLHttpRequest) { // Si es Mozilla, Safari etc XMLHttp = new XMLHttpRequest (); } else { if (window.ActiveXObject) { // pero si es IE try { XMLHttp = new ActiveXObject ("Msxml2.XMLHTTP"); } catch (e) { // en caso que sea una versión antigua try { XMLHttp = new ActiveXObject ("Microsoft.XMLHTTP"); } catch (e) { return false; } } } else { return false; } } return XMLHttp; } function cargarContenidoAjaxPOST(url, post, contenedor) { ajax = Ajax(); if (ajax==false) { alert("Exception AJAX"); return; } ajax.open("POST",url,true); ajax.onreadystatechange=function() { if (ajax.readyState == 4 && (ajax.status == 200 || window.location.href.indexOf ("http") == - 1)) { contenedor.innerHTML = ajax.respo...

Este codigo es la recopilación de varios mini-manuales encontrados por internet. Este ejemplo es para enviar los parametros por el método POST. /* ajax.js */ function Ajax() { var XMLHttp = false; if (window.XMLHttpRequest) { // Si es Mozilla, Safari etc XMLHttp = new XMLHttpRequest (); } else { if (window.ActiveXObject) { // pero si es IE try { XMLHttp = new ActiveXObject ("Msxml2.XMLHTTP"); } catch (e) { // en caso que sea una versión antigua try { XMLHttp = new ActiveXObject ("Microsoft.XMLHTTP"); } catch (e) { return false; } } } else { return false; } } return XMLHttp; } function cargarContenidoAjaxPOST(url, post, contenedor) { ajax = Ajax(); if (ajax==false) { alert("Exception AJAX"); return; } ajax.open("POST",url,true); ajax.onreadystatechange=function() { if (ajax.readyState == 4 && (ajax.status == 200 || window.location.href.indexOf ("http") ...

Mediante AJAX podemos recargar solo una parte del contenido de un documento html. Este ejemplo es una versión minimamente modificada de un código que me encontré en internet. Siento no hacer referencia a ese sitio pero no me acuerdo de la url. /* codigo javascript */ // Documento JavaScript // llamamos a que se recarge el contenido del div con ese id_contenedor // mediante la llamada a la url function mostrarNuevoContenido(url, id_contenedor) { var Ajax = new AJAX(url, id_contenedor); } // todo es correcto y ha llegado el momento de poner la información requerida // en su sitio en la pagina xhtml function cargarpagina (pagina_requerida, id_contenedor) { if (pagina_requerida.readyState == 4 && (pagina_requerida.status == 200 || window.location.href.indexOf ("http") == - 1)) document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText; } function AJAX(url, id_contenedor) { ...