Sabtu, 16 Maret 2013

Tutorial Ajax Post

Tutorial Ajax Post
Tutorial Ajax Post
Tutorial Ajax Post - AJAX = Asynchronous JavaScript dan XML.

AJAX adalah seni bertukar data dengan server, dan memperbarui bagian-bagian dari suatu halaman web - tanpa reload seluruh halaman.
 




Dalam postingan saya kali ini saya akan sharing tentang Tutorial Ajax Post .Berikut contoh Ajax Post :

index.html

$("form#form").submit(function(){
    if (confirm("Apakah benar akan menyimpan data ini?")){
  
      $.ajax({
         url: "proses_data.php",
         type:$(this).attr("method"), //metode yg digunakan sesuai pada form
         data:$(this).serialize(), //mengirim data secara serialize
         dataType: 'json', //respon yang diminta dalam format JSON
         success:function(response){
           if(response.status == 1) // return nilai dari hasil proses
           { 
             alert("Data berhasil disimpan!");
                }
           else
           {
            alert("Data gagal di simpan!");
           }
         }
        });
      return false;
     
    }
    return false;
  }); 
 
 <form action="" name="form" id="form" method="post">
                <fieldset>
                    <p>
                        <label for="email">E-Mail:</label>
                        <input type="text" name="email" id="email" value="" />
                    </p>
                    <p>
                        <input type="submit" name="submit" id="submit" value="Submit" />
                    </p>
                </fieldset>
            </form>
 

Nah setelah ajax post diatas selesai , kita buat 1 file lagi bernama proses_data.php . Di proses_data.php ini anda dapat mengisi script insert ataupun update .
Untuk Tutorial Ajax Post ini saya gunakan script insert php

proses_data.php
 
<?php 
mysql_connect('localhost','root','');
mysql_select_db('dbname');
 
mysql_query("insert into tbl_name(email) values('$_POST[email]')");
 
echo '{"status":"1"}'; 
exit;
?> 

 
Demikian Tutorial Ajax Post ini , semoga dapat bermanfaat .

Tidak ada komentar:

Posting Komentar