Manual de Ajax usando el método POST Aprendiendo lo básico de ajax con el método post Ajax y El método POST Por Ajaxman 31/07/2007
Manual de Ajax usando el método POST
Ahora revisaremos como poder utilizar el método “post” con ajax.
Creamos como siempre la pagina que es donde realizaremos las peticiones via javascript, a otro archivo. Pagina_dinamica_post.html _________________________________________________________________
Metodo post con ajax <script language=”JavaScript” type=”text/javascript”> /**/
____________________________________________________________________ Ahora vamos por partes, primero necesitamos agregarle a nuestra página web, un formulario con un action a javascript, esto es necesario porque, cuando alguien le da enter y es el ultimo o único campo del formulario este se enviara la pagina que este, indicada en el action, por eso si, el action es un javascript, el formulario se enviara a la función.
2007
Manual de Ajax usando el método POST
No es necesario indicarle al formulario que use método POST ya que se indicara en las funciones javacript. Al cual, no es necesario agregarle un id, y le asignamos, un evento on click, con el cual llamamos a una función, en este caso no es necesario agregarle parámetros, pues no los necesita. Recordemos que para el nombre de la función no es necesario que se llame _ajax, se puede llamar de cualquier forma, sin embargo es mejor nombrarla, con algún nombre que caracterice su funcionamiento. Generamos El objeto ajax(Si tienes dudas sobre como crearlo puedes checar el manual de Ajax con metodo GET): if ( typeof XMLHttpRequest == “undefined” ) XMLHttpRequest = function(){ return new ActiveXObject( navigator.userAgent.indexOf(”MSIE 5?) >= 0 ? “Microsoft.XMLHTTP” : “Msxml2.XMLHTTP” ); }; Luego lo instanciamos de la siguiente manera: var ajax=new XMLHttpRequest(); Ahora creamos la función que se encargara de hacer la petición a la otra página web: function _Ajax() { var nombre=document.getElementById(’nombre’).value; ajax.open(”POST”,”ajax_post.php”,true); ajax.onreadystatechange=function(){ if(ajax.readyState==4) { var respuesta=ajax.responseText; document.getElementById(’resultado’).innerHTML=respuesta; } } ajax.setRequestHeader(”Content-Type”, “application/x-www-formurlencoded”); ajax.send(”nombre=”+nombre+”&otravariable=1 ); } ″
2007
Manual de Ajax usando el método POST
Veamos los puntos importantes de la función anterior: El nombre de la función: ajax.open(”POST”,”ajax_post.php”,true); En este ejemplo usaremos el método post y basta con escribirlo en el primer argumento de nuestro método open ajax.setRequestHeader(”Content-Type”, “application/x-www-formurlencoded”); Este método nos va a permitir añadir encabezados a nuestro archivo que genere el proceso, en este caso se le añade el tipo de contenido usado para enviar el formulario al servidor (cuando el valor del atributo method sea “post”). El valor por defecto de este atributo es “application/x-www-form-urlencoded”. ajax.send(”nombre=”+nombre+”&otravariable=1 ); ″
En el ultimo método vemos que es por donde se envían las variables, como si fueran por get, aunque en este caso usamos método post, si queremos usar mas variables, simplemente las concatenamos. En este caso enviaremos, null, ya que no es necesario enviar más datos. Ahora creamos la página ajax_post.php _______________________________ _______________________________ y listo, ya tenemos nuestra segunda aplicacion con ajax. Para los que no sepan que es var_dump, digamos que examina las variables que uno le indique, en este caso, revisa todas las variables, quien recibió por post y las muestra.
2007
Manual de Ajax usando el método POST
Puede encontrar este y otros artículos además de más información en la Página web de www.Ajaxman.net
2007
