Predložiť formulár s metódou POST pomocou AJAX a jQuery

V predchádzajúcom článku sme videli, ako odoslať formulár s AJAX pre odosielanie pošty s ASP alebo PHP, pomocou jednoduchého JavaScript knižnica používa pre príklady sprievodca AJAX easthamptonfireco1.com, rovnako ako pre mnoho ďalších položiek.

Knižnica v otázke, veľmi rýchle a ľahké, ale používa metódu GET pre odosielanie dát, ale pri odoslaní formulára v prípade použitia metódy POST z prostého dôvodu: QueryString (parametre, ktoré sú odovzdané v URL pomocou metódy GET) majú limit 255 znakov vrátane medzier, zatiaľ čo metóda POST netrpí týmto obmedzením.

Pre návrat veľmi pohodlné knižnice jQuery , ktorý má veľmi príjemné pracovať s funkciami AJAX.

Zoberme si jednoduchý príklad odosielanie dát v post s AJAX, buď ich sťahovanie cez PHP ASP, zatiaľ čo na strane servera, skript jednoducho vytlačiť na obrazovku odosielaných dát: pre čitateľa úlohu spravovať podľa svojich potrieb.

Prvé pripomenúť knižnice jquery.js záhlaví našich webových stránok:

 



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

 

Staviame HTML formulára:

 <form name="modulo">



    



 <p> Názov </ p>



    



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



    



 <p> Priezvisko </ p>



    



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



    



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







 </ Form>









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

Jednoduchý formulár, ktorý obsahuje dve polia, tlačidlá a displej tlačené vrstvy na ktorej výsledok operácie.

Pozrime sa teraz analyzujú kód Javascript:

 <script type="text/javascript">







 $ (Document). Ready (function () {



  



 $ ("# Tlačidlo"). Click (function () {



    



 var name = $ ("# meno") val ().



    



 var name = $ ("# meno") val ().



    



 $. Ajax ({



      



 Typ: "POST",



      



 url: "dati.ext"



      



 Typ dát: "html",



      



 Úspech: function (msg)



      



 {



        



 . $ ("# Výsledok"), HTML (msg);



      



 }



      



 Chyba: function ()



      



 {



        



 alert ("volanie zlyhalo, skúste to prosím znova ...");



      



 }



    



 });



  



 });







 });







 </ Script>

Sme späť, a to prostredníctvom metódy Ajax, charakteristiky prenosu: bude metóda (POST), URL na strane servera spracuje dáta (*), potom stanovuje, že návratová hodnota bude vo formáte HTML a konečne tlače na video potvrdenie alebo chyby vo výzve.

Všimnite si, že jQuery má tiež zaujímavú skratku zvládnuť Ajax hovory pomocou metódy POST:

 <script type="text/javascript">







 $ (Document). Ready (function () {



  



 $ ("# Tlačidlo"). Click (function () {



    



 var name = $ ("# meno") val ().



    



 var name = $ ("# meno") val ().



    



 $ Post ("dati.ext", {meno: meno, priezvisko: priezvisko} .., Funkcia (msg) {$ ("# výsledok"), HTML (msg );});

Na miesto () metóda už máme za sebou, v poriadku, URL skriptu na strane servera, ktorá bude prijímať a spracúvať žiadosti, údaje získané z formy a funkcie spätného volania, ktorá sa bude tlačiť na výstupe.

• <<
• 1
• 2
• >>