A jQuery szó mi szó a legjobbnak mondható JS keretrendszer napjainkban, azonban azért vannak érdekes dolgai. Ezúttal az AJAX postolás igazi csapdáját fedjük fel, amit már oly sokszor elvétettünk.

Az alapokba nem mennénk bele, hiszen a jquery oldala alaposan tárgyalja az AJAX használatát. Alap esetben ugye van egy formunk, aminek postolt elemeit szeretnénk elküldeni egy PHP számára, ami majd jól feldolgozza. Íme tehát az alap felállású form:

<div class=".holder">
<form id="registrationform" method="post" action="">
<input type="text" id="newemail" name="newemail">
<input type="text" id="newuser" name="newuser">
<input type="button" value="Elküld" onclick="submitreg()">
</form>
</div>

Ezzel tehát kész a form, amivel egy mező tartalmát fogjuk elküldeni a php-nk számára a submitreg() javascript függvénnyel. Már magánál a form felépítésénél azonban vigyáznunk kell egy-két dologra! Ezek pedig a következőek:

• NE használjunk type="submit" vagy <button> típusú elküldő gombokat mert mindkettő elpostolja a formot azonnal és nem lesz AJAXunk. Ha mindenképp ilyen gombokat szeretnénk használni rakjuk ki a </form> tagon kívülre ugyanis mindegy hol a gomb az onclick esemény lesz a fontos.


• MINDIG adjunk name tagot az elpostolandó mezőnek! Hatalmas galibákat okozhat ugyanis postolásnál lévén a jquery serialize() függvénye csak name paraméterekre bukik, azt dolgozza fel.


• Form köré igyekezzünk mindig egy DIV-et rakni nem csak későbbi design céljából, hanem mert így az AJAXunknak lesz egy semlegesnek mondható hordozó DIV-je, amit meghívhat és tartalommal tölthet fel.

Ha ezekre figyeltünk és minden meg van jöhet a világ leg egyszerűbb függvénye, amivel a PHP-nkat meghívva megkapjuk az eredményt és a form helyére kiíratjuk a sikeresen lefutó PHP tartalmát:

function submitreg (){
$.ajax({
type: "POST",
url: "sample.php",
data: $("#registrationform").serialize(),
success: function(data){
$('.holder).html(data);
}
});
}

Ennyi lenne tehát a függvény. POST-olt elemeinket a sample.php dolgozza fel amiben sima echo ""-zással visszatérő értékeket a jquery .html függvénye bepakolja a formunk kürl található DIV-be. Így a form eltűnik és mi azt iratunk ki a PHP-vel a helyére amit akarunk.

sample.php tartalma például: <?php echo "sikeres lefutás --> $_POST[newemail], $_POST[newuser]"; ?>

Ha ezt a pár dolgot betartjuk nem lesz bajunk az AJAX postolással jQuery-ben.