Hallo teman-teman Dumet School. Kali ini saya akan membahas tentang Cara Menampilkan Data JSON Dengan AJAX Javascript. AJAX bukan bahasa pemrograman tetapi sebuah teknik untuk mengakses server web dari halaman web. AJAX adalah singkatan dari Asynchronous JavaScript And XML. Pada Artikel kali ini saya ingin memperkenalkan terlebih dahulu tentang objek XMLHttpRequest. Objek XMLHttpRequest dapat digunakan untuk bertukar data dengan server di belakang layar. Ini berarti bahwa mungkin untuk memperbarui bagian dari halaman web, tanpa memuat ulang seluruh halaman. Semua browser modern (Chrome, Firefox, IE7 +, Edge, Safari Opera) memiliki objek XMLHttpRequest built-in.

Oke untuk dapat mengetahui Cara Menampilkan Data JSON Dengan AJAX Javascript, pertama teman-teman langsung saja membuat struktur htmlnya. Disini saya sediakan sebuah tag ul untuk dapat menampilkan data beberapa data.

Jika sudah maka tahap kedua saya akan membuat data dengan format JSON yang nantinya akan saya tampilkan dengan menggunakan AJAX Javascript. Berikut adalah format datanya yang saya buat.

Dan tahap terakhir yaitu saya akan membuat script AJAXnya untuk dapat menampilkan data JSON tersebut.

Disini teman-teman bias perhatikan untuk method ajax.open menggunakan $_GET dengan melakukan src atau search sesuai nama dari data JSON disambung dengan nilai true. Lalu di sambung dengan property  ajax.onreadystatechange yang didalamnya ada kondisi untuk mengecek property readyState dimana property ini menyimpan status XMLHttpRequest dan kemudian property status yang mengembalikan nomor status permintaan. Jika teman-teman buka di broser masing-masing maka akan terlihat ul dengan id result akan akan berisi li dengan data yang sudah kita ambil dari data JSON.

Demikian artikel tentang Cara Menampilkan Data JSON Dengan AJAX Javascript. Semoga dapat bermanfaat dan selamat mencoba.