Вы находитесь на странице: 1из 5
Manual de Ajax usando el método POST Aprendiendo lo básico de ajax con el método
Manual de Ajax usando el método POST Aprendiendo lo básico de ajax con el método

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

usando el método POST Aprendiendo lo básico de ajax con el método post Ajax y El

Manual de Ajax usando el método POST

2007
2007

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

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml”>

<head> <title>Metodo post con ajax</title> <script language=”JavaScript” type=”text/javascript”> /*<![CDATA[*/ function _Ajax()

{

}

/*]]>*/ </script> </head> <body> <form action=”javascript:_Ajax();” method=”get”> <input name=”nombre” id=”nombre” type=”text”/> <input type=”button” name=”aceptar” value=”Aceptar” onclick=”_Ajax();”/> </form> <div id=”resultado”> </div> </body>

</html>

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.

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.

2007
2007

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-form- urlencoded”);

ajax.send(”nombre=”+nombre+”&otravariable=1);

}

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);

2007
2007

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-form- urlencoded”);

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

<?php

var_dump($_POST);

?>

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.

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
2007