Presentar un formulario con el método POST con AJAX y jQuery

En un artículo anterior vimos cómo enviar un formulario con AJAX para enviar correo con ASP o PHP, utilizando una simple librería JavaScript usado en los ejemplos de la guía para AJAX cesarogcaleb.com, así como a muchos otros artículos.

La biblioteca en cuestión, muy rápido y ligero, se utiliza el método GET para enviar datos, pero cuando se envía un formulario en el caso de utilizar el método POST por una razón simple: una cadena de consulta (los parámetros que se pasan en la URL mediante el método GET) tienen un límite de 255 caracteres incluidos los espacios, mientras que el método POST no sufren de esta limitación.

Con el fin de devolver la biblioteca muy cómodo jQuery , que tiene muy cómodo para trabajar con funciones de AJAX.

Tomemos un ejemplo sencillo de envío de datos en un POST con AJAX, ya sea mediante la recuperación de ellos a través de PHP ASP, mientras que del lado del servidor sólo se imprimirán los datos de pantalla enviado: para el lector la tarea de administrar de acuerdo a sus necesidades.

En primer lugar recordar la cabecera jquery.js biblioteca de nuestra página web:

 



 <script type="text/javascript" src="jquery.js"> </ script>

 

Construimos el formulario HTML:

 <form name="modulo">



    



 Nombre </ p>



    



 <p> <input type="text" name="nome" id="nome=> </ p>



    



 Apellidos </ p>



    



 <p> <input type="text" name="cognome" id="cognome"> </ p>



    



 <input type="button" id="bottone" value="Invia la dati">







 </ Form>









 <div id="risultato"> </ div>

Una forma simple que contiene dos campos, un botón y una capa de serigrafía en la que el resultado de la operación.

Vamos ahora a analizar el código Javascript:

 <script type="text/javascript">







 $ (Document). Ready (function () {



  



 $ ("# Botón"). Haga clic en (function () {



    



 var nombre = $ ("# nombre") val ().;



    



 var nombre = $ ("# nombre") val ().;



    



 $. Ajax ({



      



 tipo: "POST",



      



 url: "dati.ext"



      



 tipo de datos: "html",



      



 éxito: function (msg)



      



 {



        



 . $ ("# Resultado") Html (msg);



      



 },



      



 error: function ()



      



 {



        



 alert ("Llame por favor, inténtalo de nuevo ...");



      



 }



    



 });



  



 });







 });







 </ Script>

Se recupera, a través del método de ajax, las características de la transmisión: el método (POST), la dirección URL del servidor se encargará de los datos (*), a continuación, especificar que el valor de retorno será en formato HTML y, finalmente, imprimir en vídeo el mensaje de confirmación o de cualquier error en la llamada.

Tenga en cuenta que jQuery tiene también un acceso directo interesantes para manejar las llamadas Ajax, con el método POST:

 <script type="text/javascript">







 $ (Document). Ready (function () {



  



 $ ("# Botón"). Haga clic en (function () {



    



 var nombre = $ ("# nombre") val ().;



    



 var nombre = $ ("# nombre") val ().;



    



 $ Mensaje ("dati.ext", {name: nombre y apellidos: apellido}.., Function (msg) {$ ("# resultado") Html (msg );});

En el método post () que hemos pasado, con el fin, la URL del script del lado del servidor que recibirá y procesará la solicitud, los datos recuperados de la forma y la función callback que se imprimirá en la salida.

• <<
• 1
• 2
• >>