Μιλήσαμε για το GET στο τελευταίο βίντεο, αλλά δεν δώσαμε αρκετή προσοχή στο POST. Έτσι νόμιζα ότι θα το κάναμε εδώ. Η μεγάλη διαφορά με το POST είναι ότι σχεδόν πάντα πρέπει να διαβιβάζετε δεδομένα με το αίτημα. Αυτά τα δεδομένα μπορούν να έχουν πολλές μορφές, αλλά μπορεί να είναι ένα αντικείμενο που έχετε. Η σύνταξη είναι επίσης εύκολη:
$.post( "/data/process.php", ( name: "Susan", job: "Writer" ) function(data, textStatus, jqXHR) ( // success ) );
Παρατηρήστε τη δεύτερη παράμετρο που είναι ένα αντικείμενο (ουσιαστικά JSON) δεδομένων. Αυτά τα δεδομένα μπορούν να είναι σχεδόν οτιδήποτε (συμπεριλαμβανομένης μιας συμβολοσειράς). Είναι από εσάς να το περάσετε με τέτοιο τρόπο που να είναι χρήσιμο για το backend σας.
Επιστροφή στο παράδειγμα της φόρμας μας από το τελευταίο βίντεο, τι γίνεται αν θέλετε να διαβιβάσετε όλα τα δεδομένα από ολόκληρη τη φόρμα; Επίσης, δεν θέλετε να ενημερώσετε το JavaScript όταν αλλάξει η φόρμα. Το jQuery το καθιστά εύκολο με τη μέθοδο serialize (). Απλώς καλέστε το στο ίδιο το στοιχείο φόρμας:
$("#my-form").serialize();
Αυτό θα εξετάσει ολόκληρη τη φόρμα και θα δημιουργήσει μια συμβολοσειρά ερωτήματος από κάθε όνομα εισόδου στη φόρμα. Στη συνέχεια, μπορείτε να το χρησιμοποιήσετε ως δεδομένα που έχετε περάσει όταν κάνετε $ .post ().
$("#my-form").on("submit", function() ( $.post( "/", $("#my-form").serialize(), function(data, textStatus, jqXHR) ( console.log("success"); ) ); ));
Δείτε το Pen CtoEg του Chris Coyier (@chriscoyier) στο CodePen