Cara Membuat Submit No Reload Dengan AJAX


  1. Pertama-tama , kita membutuhkan modul AJAX. Bagi yang belum punya, bisa di download di sini
  2. Taruh di folder yang sama dengan form
  3. Kita buat formnya :D , misalnya formnya seperti ini. Juga dengan JavaScriptnya. Di save dengan format PHP, namanya terserah
<script type="text/javascript" src="1.5.2.main.js"></script>//<--- memanggil modul AJAX
<script type="text/javascript">
function proses(){
$("#proses").html('Loading...');
$.post('proses.php', $("form").serialize(), function(hasil){
$("#proses").html(hasil);
});
}
</script>
//$("#loading").html('Loading...'); = Saat proses POST akan terjadi apa/ memunculkan apa
//$.post('proses.php', $("form").serialize(), function(hasil){ = POST ke proses.php, dan mengubah hasil POST ke variable hasil
//$("#loading").html(hasil); = perintah memunculkan hasil dari POST form ke tempat loading

<h2>Dragon City Exp</h2><br>
<form method="post" action="">
Nama : <input type="text" id="nama" name="nama"><br>//<--- Kotak nama
Alamat : <input type="text" id="alamat" name="alamat">//<---Kotak alamat
<input type="submit" value="Submit" onClick="proses(); return false;">//<---Submit Button. onClick="()proses" akan di load di Java Script di atas
<div id="loading"></div>//<--- tempat meload hasil loading
      
     4. Buat proses.php
<?PHP
$nama=$namaa
$alamat=$alamattt

echo "Nama : $namaaa";
echo "Alamat : $alamattt";
?>
    5. Siap di pakai :D

Previous
Next Post »

Berkomentarlah dengan baik dan benar Show Konversi KodeHide Konversi Kode Show EmoticonHide Emoticon

Thanks for your comment