jQuery Ajax POST-eksempel med PHP
Jeg prøver å sende data fra et skjema til en database. Her er skjemaet jeg bruker:
<form name="foo" action="form.php" method="POST" id="foo">
<label for="bar">A bar</label>
<input id="bar" name="bar" type="text" value="" />
<input type="submit" value="Send" />
</form>
Den typiske tilnærmingen ville være å sende inn skjemaet, men dette fører til at nettleseren blir omdirigert. Er det mulig å bruke jQuery og Ajax til å fange opp alle dataene i skjemaet og sende dem til et PHP-skript (for eksempel form.php)?
652
3
Grunnleggende bruk av
.ajax
vil se omtrent slik ut:HTML:
jQuery:
*Merk: Siden jQuery 1.8 er
.success()
,.error()
og.complete()
utdatert til fordel for.done()
,.fail()
og.always()
.$(document).ready()
handler (eller bruke$()
shorthand).*.Tips: Du kan kjede callback-handlerne slik:
$.ajax().done().fail().always();
$.ajax().done().fail().always();
*PHP (det vil si form.php):
Note: Alltid sanitize posted data, for å forhindre injeksjoner og annen ondsinnet kode.
Du kan også bruke forkortelsen
.post
i stedet for.ajax
i JavaScript-koden ovenfor:Merk: JavaScript-koden ovenfor er laget for å fungere med jQuery 1.8 og nyere, men den bør fungere med tidligere versjoner ned til jQuery 1.5..
For å gjøre en Ajax-forespørsel ved hjelp av jQuery kan du gjøre dette med følgende kode.
HTML:
JavaScript:
Metode 1
Metode 2
Tilbakekallene
.success()
,.error()
og.complete()
er utdatert fra og med jQuery 1.8. Bruk.done()
,.fail()
og.always()
i stedet for å forberede koden din for eventuell fjerning.MDN: abort()
. Hvis forespørselen allerede er sendt, vil denne metoden avbryte forespørselen.Så vi har sendt en Ajax-forespørsel, og nå er det på tide å hente data til serveren.
PHP
Når vi lager en POST-forespørsel i et Ajax-kall (
type: "post"), kan vi nå hente data ved hjelp av enten
$_REQUESTeller
$_POST`:Du kan også se hva du får i POST-forespørselen ved ganske enkelt enten. Sørg for øvrig for at
$_POST
er angitt. Ellers vil du få en feil.Og du setter inn en verdi i databasen. Forsikre deg om at du sensitizing eller escaping Alle forespørsler (enten du gjorde en GET eller POST) riktig før du gjør spørringen. Det beste ville være å bruke forberedte utsagn.
Og hvis du vil returnere data tilbake til siden, kan du gjøre det ved å bare ekko disse dataene som nedenfor.
Og så kan du få det som:
Det finnes et par stenografimetoder. Du kan bruke koden nedenfor. Den gjør det samme arbeidet.
Du kan bruke serialize. Nedenfor er et eksempel.