PENGENALAN / DEFINISI
- AJAX (Asynchronous Javascript And XML)
- Melakukan request terhadap server melalui javascript
dan ...
PEMBATASAN BAHASAN
Pada bahasan ini, implementasi AJAX akan menggunakan fungsi-fungsi
yang telah disediakan oleh jQuery.
C...
IMPLEMENTASI [1]
Untuk contoh :
“Kita akan membuat sebuah proses pengambilan data
identitas mahasiswa berdasarkan NIM yang...
IMPLEMENTASI [2]
3) Buatlah database dengan nama db_ajax
4) Buatlah tabel :
1. tbl_mahasiswa, dengan field-field :
a) NIM ...
IMPLEMENTASI [3]
File – file yang disiapkan :
IMPLEMENTASI – RESPON PLAIN TEXT [1]
Pada file index.php isikan code berikut :
<script type="text/javascript" src="jquery/...
IMPLEMENTASI – RESPON PLAIN TEXT [2]
<script>
$(document).ready(function() {
$('#btnCari').click(function() {
var nim = $(...
IMPLEMENTASI – RESPON PLAIN TEXT [3]
Pada file service-mahasiswa.php isikan code berikut :
<?php
mysql_connect("localhost"...
IMPLEMENTASI – RESPON PLAIN TEXT [4]
Hasilnya saat dibuka di browser :
IMPLEMENTASI – RESPON JSON [1]
Pada file index.php isikan code berikut :
<script type="text/javascript" src="jquery/jquery...
IMPLEMENTASI – RESPON JSON [2]
<script>
$(document).ready(function() {
$('#btnCari').click(function() {
var nim = $('#nim'...
IMPLEMENTASI – RESPON JSON [3]
Pada file service-mahasiswa.php isikan code berikut :
<?php
mysql_connect("localhost", "roo...
IMPLEMENTASI – RESPON JSON [4]
Hasilnya saat dibuka di browser :
PEMBAHASAN MATERI PENDUKUNG [1]
JSON (JavaScript Object Notation)
- merupakan format untuk pertukaran data seperti halnya ...
PEMBAHASAN MATERI PENDUKUNG [1]
Untuk membuat json dengan php yaitu dengan menggunakan fungsi berikut :
json_encode($array...
Ajax - PHP
Ajax - PHP
Ajax - PHP
Ajax - PHP
Upcoming SlideShare
Loading in …5
×

Ajax - PHP

464 views
346 views

Published on

Published in: Software
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
464
On SlideShare
0
From Embeds
0
Number of Embeds
59
Actions
Shares
0
Downloads
17
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Ajax - PHP

  1. 1. PENGENALAN / DEFINISI - AJAX (Asynchronous Javascript And XML) - Melakukan request terhadap server melalui javascript dan tanpa memerlukan refresh browser
  2. 2. PEMBATASAN BAHASAN Pada bahasan ini, implementasi AJAX akan menggunakan fungsi-fungsi yang telah disediakan oleh jQuery. Core jQuery bisa didapatkan melalui website resminya : http://jquery.com/ Pada pembahasan ini akan mencontohkan 2 jenis format respon dari server : 1) Plain Text 2) Json
  3. 3. IMPLEMENTASI [1] Untuk contoh : “Kita akan membuat sebuah proses pengambilan data identitas mahasiswa berdasarkan NIM yang dimilikinya.” 1) Download file jquery.js dari http://jquery.com 2) Buatlah file : 1) Index.php 2) service-mahasiswa.php
  4. 4. IMPLEMENTASI [2] 3) Buatlah database dengan nama db_ajax 4) Buatlah tabel : 1. tbl_mahasiswa, dengan field-field : a) NIM VARCHAR(20) b) NAMA VARCHAR(100) c) ALAMAT VARCHAR(225) d) TELP VARHCAR(15) e) EMAIL VARCHAR(50)
  5. 5. IMPLEMENTASI [3] File – file yang disiapkan :
  6. 6. IMPLEMENTASI – RESPON PLAIN TEXT [1] Pada file index.php isikan code berikut : <script type="text/javascript" src="jquery/jquery.js"></script> <script></script> NIM : <input type="text" name="nim" id="nim"> <input type="button" id="btnCari" value="Cari"> <div id="identitas"></div>
  7. 7. IMPLEMENTASI – RESPON PLAIN TEXT [2] <script> $(document).ready(function() { $('#btnCari').click(function() { var nim = $('#nim').val(); $.ajax({ type : 'post', data : 'nim='+nim, url : 'service-mahasiswa.php', success : function(hasil){ $('#identitas').html(hasil); } }); }); }); </script> Pada file tersebut lengkapi tag <script></script> dengan baris code berikut :
  8. 8. IMPLEMENTASI – RESPON PLAIN TEXT [3] Pada file service-mahasiswa.php isikan code berikut : <?php mysql_connect("localhost", "root", ""); mysql_select_db("db_ajax"); if (isset($_POST['nim'])) { $nim = mysql_escape_string($_POST['nim']); $query = "SELECT * FROM tbl_mahasiswa WHERE NIM = '{$nim}'"; $result = mysql_query($query); if ($data = mysql_fetch_array($result)) { echo "NAMA : {$data['NAMA']} <br/>", "ALAMAT : {$data['ALAMAT']} <br/>", "TELP : {$data['TELP']} <br/>", "EMAIL : {$data['EMAIL']} <br/>"; } } ?>
  9. 9. IMPLEMENTASI – RESPON PLAIN TEXT [4] Hasilnya saat dibuka di browser :
  10. 10. IMPLEMENTASI – RESPON JSON [1] Pada file index.php isikan code berikut : <script type="text/javascript" src="jquery/jquery.js"></script> <script></script> NIM : <input type="text" name="nim" id="nim"> <input type="button" id="btnCari" value="Cari"><br/><br/> NAMA : <input type="text" name="nama" id="nama"> <br/> ALAMAT : <input type="text" name="alamat" id="alamat"> <br/> TELP : <input type="text" name="telp" id="telp"> <br/> EMAIL : <input type="text" name="email" id="email">
  11. 11. IMPLEMENTASI – RESPON JSON [2] <script> $(document).ready(function() { $('#btnCari').click(function() { var nim = $('#nim').val(); $.ajax({ type : 'post', data : 'nim='+nim, url : 'service-mahasiswa.php', dataType : 'json', success : function(hasil){ $('#nama').val(hasil.NAMA); $('#alamat').val(hasil.ALAMAT); $('#telp').val(hasil.TELP); $('#email').val(hasil.EMAIL); } }); }); }); </script> Pada file tersebut lengkapi tag <script></script> dengan baris code berikut :
  12. 12. IMPLEMENTASI – RESPON JSON [3] Pada file service-mahasiswa.php isikan code berikut : <?php mysql_connect("localhost", "root", ""); mysql_select_db("db_ajax"); $identitas = array(); if (isset($_POST['nim'])) { $nim = mysql_escape_string($_POST['nim']); $query = "SELECT * FROM tbl_mahasiswa WHERE NIM = '{$nim}'"; $result = mysql_query($query); if ($data = mysql_fetch_array($result)) { $identitas['NAMA'] = $data['NAMA']; $identitas['ALAMAT'] = $data['ALAMAT']; $identitas['TELP'] = $data['TELP']; $identitas['EMAIL'] = $data['EMAIL']; } } echo json_encode($identitas); ?>
  13. 13. IMPLEMENTASI – RESPON JSON [4] Hasilnya saat dibuka di browser :
  14. 14. PEMBAHASAN MATERI PENDUKUNG [1] JSON (JavaScript Object Notation) - merupakan format untuk pertukaran data seperti halnya XML. - JSON memiliki format agak mirip seperti array, dia memiliki index dan value Contoh json : {"NAMA":"ASEP ARDI", "ALAMAT":"BANDUNG", "TELP":"085295XXXXXX", "EMAIL":"asepardiwinardi@gmail.com"}
  15. 15. PEMBAHASAN MATERI PENDUKUNG [1] Untuk membuat json dengan php yaitu dengan menggunakan fungsi berikut : json_encode($array); Misal : $identitas = array(); $identitas['NAMA'] = "ASEP ARDI"; $identitas['ALAMAT'] = "BANDUNG"; $identitas['TELP'] = "085295XXXXXX"; $identitas['EMAIL'] = "asepardiwinardi@gmail.com"; echo json_encode($identitas);

×