• Membuat AutoComplete Suggest Box menggunakan PHP dan MySQL






    Download file:
    http://www.4shared.com/file/OhPmJjOp/suggest_autocomplete.html


    Latar Belakang
    Saat saya membuat sebuah web (E-Accounting) ada sebuah “kasus” dimana dalam sebuah form, terkadang ada sebuah inputan yang nilainya tidak boleh sembarangan diinput oleh user. dalam kasus ini adalah input nomor rekening (nomor perkiraan).
    Alur Program
    1. User menginput angka pertama misalnya 11 pada nomor rekening.
    2. Aplikasi akan memunculkan sebuah suggest yang menampilkan pilihan nomor rekening yang akan digunakan.
    3. Nomor rekening yang muncul mulai 111.01 sampai dengan 114.01 sesuai dengan data yang ada didalam database.
    4. User memilih salah satu yang nomor rekening.
    5. Hasil akhir dari aplikasi ini, nomor rekening dan nama rekening yang dipilih akan ditampilkan atau dipindahkan nilainya ke dalam form.
    6. selesai.
    Sumber Data
    Data yang ditampilkan dalam suggest diambil dari sebuah database.


    • Database yang digunakan adalah : auto_complete_DB
    • Tabel yang digunakan adalah : tabel_master
    • Konfigurasi Database ada di file : autosuggest.php

    Potongan script autosuggest.php
    • Database yang digunakan adalah : auto_complete_DB
    • Tabel yang digunakan adalah : tabel_master
    • Konfigurasi Database ada di file : autosuggest.php
    Potongan script autosuggest.php
    $db = new mysqli(‘localhost’, ‘root’ ,”, ‘auto_complete_DB’);
    if(!$db) {
    echo ‘Could not connect to the database.’;
    } else {
    if(isset($_POST['queryString'])) {
    $queryString = $db->real_escape_string($_POST['queryString']);
    if(strlen($queryString) >0) {
    $query = $db->query(“SELECT nama_rekening,kode_rekening FROM tabel_master WHERE kode_rekening LIKE ‘$queryString%’”);
    if($query) {
    echo ‘
      ’;
      while ($result = $query ->fetch_object()) {
      echo ‘
    • nama_rekening).’\'); fill2(\”.addslashes($result->kode_rekening).’\');”>’.$result->kode_rekening.’  ’.$result->nama_rekening.’
    • ‘;
      }
      echo ‘
    ’;
    } else {
    echo ‘OOPS we had a problem :( ‘;
    }} else {
    // do nothing
    }} else {
    echo ‘There should be no direct access to this script!’;
    }}
    ?>
    Dalam aplikasi suggest logikanya seperti pencarian dengan menggunakan kata kunci. jika anda ingin mengubah aplikasi ini sesuai dengan kebutuhan anda yang harus anda ubah adalah :
    • Ubah Query nya $query = $db->query(“SELECT nama_rekening,kode_rekening FROM tabel_master WHERE kode_rekening LIKE ‘$queryString%‘”);
    • Gunakan fungsi fill untuk mengkap nilai database dan menampilkan nilai field nya. fill(\”.addslashes($result->nama_rekening).’\')
    • Jika ada field yang ingin ditampilkan lagi, buat fungsi fill ke dua yaitu fill2(\”.addslashes($result->kode_rekening) jangan lupa untuk memisahkan fungsi fill yang pertama dengan yang kedua memakan tanda koma (;).
    Potongan script index.php (form inputan)
    script yang harus ada dalam file index.php adalah script CSS yang tidak perlu di ubah :
    script javascript yang perlu diubah :

0 komentar:

Leave a Reply

Neziakuw Gadget


 
Username
Password

Sms gratis

Photos



EnglishFrenchGermanItalianPortugueseRussianSpanish