Υποβάλετε μια φόρμα με τη μέθοδο POST με AJAX και jQuery

Σε ένα προηγούμενο άρθρο είδαμε πώς να στείλετε μια φόρμα με AJAX για να στείλετε mail με ASP ή PHP, χρησιμοποιώντας μια απλή βιβλιοθήκη JavaScript που χρησιμοποιούνται για τα παραδείγματα του οδηγού να AJAX corinne-fleurs-gironde.com, καθώς και σε πολλά άλλα στοιχεία.

Η βιβλιοθήκη αυτή, πολύ γρήγορο και ελαφρύ, χρησιμοποιεί τη μέθοδο GET για την αποστολή δεδομένων, αλλά όταν στέλνετε μια φόρμα στην περίπτωση της με τη μέθοδο POST για έναν απλό λόγο: μια QueryString (τις παραμέτρους που πέρασε στη διεύθυνση URL μέσω της μεθόδου GET), έχουν ένα όριο 255 χαρακτήρες συμπεριλαμβανομένων των διαστημάτων, ενώ με τη μέθοδο POST δεν υποφέρει από αυτόν τον περιορισμό.

Για να επιστρέψει πολύ άνετα βιβλιοθήκη jQuery , η οποία έχει πολύ άνετα να εργαστεί με AJAX λειτουργίες.

Ας πάρουμε ένα απλό παράδειγμα της αποστολής δεδομένων σε μια θέση με AJAX, είτε με ανάκτηση τους μέσω PHP ASP, ενώ server-side script θα εκτυπώσει μόνο τα δεδομένα που αποστέλλονται στην οθόνη: στον αναγνώστη το έργο της διαχείρισής τους σύμφωνα με τις ανάγκες σας.

Πρώτη ανάκληση της κεφαλίδας βιβλιοθήκη jquery.js της ιστοσελίδας μας:

 



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

 

Χτίζουμε τη μορφή HTML:

 <form name="modulo">



    



 Όνομα </ p>



    



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



    



 Επώνυμο </ p>



    



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



    



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







 </ Form>









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

Μια απλή φόρμα που περιέχει δύο πεδία, ένα κουμπί και μια οθόνη τυπωμένο στρώμα κατά την οποία το αποτέλεσμα της πράξης.

Ας αναλύσουμε τώρα τον κώδικα Javascript:

 <script type="text/javascript">







 $ (Έγγραφο). Ready (λειτουργία () {



  



 $ ("# Button"). Κάντε κλικ στο κουμπί (λειτουργία () {



    



 var name = $ ("# όνομα") val ().?



    



 var name = $ ("# όνομα") val ().?



    



 $. Ajax ({



      



 Τύπος: "POST",



      



 url: "dati.ext"



      



 Τύπος δεδομένων: "HTML",



      



 επιτυχία: λειτουργία (MSG)



      



 {



        



 . $ ("# Αποτελεσμάτων») HTML (MSG)?



      



 },



      



 σφάλμα: λειτουργία ()



      



 {



        



 alert ("Call απέτυχε, παρακαλώ προσπαθήστε ξανά ...");



      



 }



    



 })?



  



 })?







 })?







 </ Script>

Έχουμε ανακτήσει, μέσω της μεθόδου ajax, τα χαρακτηριστικά της μετάδοσης: η μέθοδος (POST), η διεύθυνση URL του διακομιστή θα χειριστεί τα δεδομένα (*), στη συνέχεια, καθορίστε ότι η επιστρεφόμενη τιμή θα είναι σε μορφή HTML και, τέλος, να εκτυπώσετε σε βίντεο το μήνυμα επιβεβαίωσης ή οποιοδήποτε λάθος στην πρόσκληση.

Σημειώστε ότι jQuery έχει επίσης μια ενδιαφέρουσα συντόμευση για να χειριστεί Ajax κλήσεις με την POST μέθοδο:

 <script type="text/javascript">







 $ (Έγγραφο). Ready (λειτουργία () {



  



 $ ("# Button"). Κάντε κλικ στο κουμπί (λειτουργία () {



    



 var name = $ ("# όνομα") val ().?



    



 var name = $ ("# όνομα") val ().?



    



 $ Δημοσίευση ("dati.ext", {Όνομα: όνομα, επώνυμο: επώνυμο}.., Λειτουργία (MSG) {$ ("# αποτέλεσμα") html (MSG );});

Στη μέθοδο μετά την () έχουμε περάσει, έτσι ώστε, το URL του script server-side, που θα λαμβάνει και να επεξεργάζεται την αίτηση, την ανάκτηση δεδομένων από τη μορφή και τη λειτουργία επανάκλησης που θα εκτυπώσετε την έξοδο.

• <<
• 1
• 2
• >>