Hallo teman-teman Dumet School. Kembali lagi dengan saya Shelli Ripati di Kursus Web Design. Kali ini saya akan membahas tentang cara Membuat Fungsi Search Dengan Ajax Javascript. Dimana Pada Kasus ini saya masih berkaitan dengan artikel saya sebelumnya tentang cara Membuat Live Edit Menggunakan Ajax Javascript Part1  . Kenapa masih berkaitan? karena disini saya sudah menampilkan data dari database yang dimana saya akan menambahkan beberapa struktur html, dan beberapa function serta file php untuk membuat fungsi search dengan ajax javascript.

untuk  Membuat Fungsi Search Dengan Ajax Javascript saya akan menambahkan div yang didalamnya ada input text untuk melakukan pencarian data saya letakkan diatas table yang pembahasan sebelumnya sudah di buat. Dan berikut ini scriptnya.

Langkah selanjutnya kita akan membuat event keyup agar ketika kita melakukan input text maka function search langsung dijalankan.

Dan langkah selanjutnya kita buatkan function search didalam function app yang sudah kita buat. berikut ini scriptnya ya teman-teman.

Nah terakhir disini kita buat file baru dengan nama search.php yang kita simpan di folder app. Dimana berisi perintah atau request melakukan pencarian dengan keyword yang kita ketik.

Dan finnaly jadilah membuat function search dengan menggunakan ajax javascript. Dimana ketika kita ketik suatu text di form pencarian data akan muncul tanpa harus mereload halamannya.

Demikian artikle tentang cara Membuat Fungsi Search Dengan Ajax Javascript. Semoga dapat bermanfaat dan selamat mencoba ya teman.

WhatsApp chat