Please enable JavaScript!
Bitte aktiviere JavaScript!
S'il vous plaît activer JavaScript!
Por favor,activa el JavaScript!
antiblock.org

 |  | 
Anda ingin membuat website?
Untuk Anda yang sedang mencari orang untuk jasa pembuatan website, Saya akan bantu buatkan aplikasi sesuai kebutuhan Anda. Segera hubungi : mail@rizaldimaulidia.com. Selengkapnya tentang profil saya klik www.rizaldimaulidia.com.

PHP

Cara Membuat Pencarian Tanpa Refresh Halaman dengan PHP dan AJAX

img-responsive

Sesuai request dari teman-teman pengunjung blog ini, saya telah membuat sebuah tutorial baru mengenai cara membuat pencarian tanpa refresh atau reload halaman dengan menggunakan PHP dan Jquery Ajax. Sebelumnya, saya juga telah membuat tutorial yang hampir mirip seperti tutorial kali ini yaitu mengenai cara membuat pencarian data dan menampilkannya ke textbox dengan PHP Ajax dan MySQL. Perbedaannya dengan tutorial kali ini adalah tutorial sebelumnya tersebut akan melakukan pencarian sesuai NIS siswa saja dan menampilkannya ke dalam sebuah textbox, sedangkan tutorial yang kali ini akan kita bahas bersama-sama mempunyai fungsi untuk melakukan pencarian berdasarkan beberapa komponen yaitu berdasarkan NIS, Nama, Jenis Kelamin, Nomor Telepon, dan Alamat siswanya. Dan hasil pencariannya akan kita tampilkan pada sebuah tabel. Selain itu, tutorial ini menggunakan bootstrap agar tampilannya terlihat lebih menarik.

Sebelum masuk ke materi utama, saya akan menjelaskan beberapa hal yang terkait dengan catatan ini yang saya ambil dari beberapa blog (URL Sumber blog saya beri di bawah catatan ini).

AJAX
Apa itu AJAX? AJAX adalah singkatan dari “Asynchronous JavaScript and XML“, merupakan metode suatu laman web menggunakan JavaScript untuk mengirim dan menerima data dari server tanpa harus menyegarkan (refresh) laman itu. XML adalah sejenis markup language – seperti HTML, yang kerap dipakai untuk mengirimkan data melalui internet. Belakangan ini, JSON (“JavaScript Object Notation”) lebih populer dan bisa dibaca – secara bawaan (native) – oleh JavaScript.

Bootstrap
Bootstrap adalah front-end framework yang solek, bagus dan luar biasa yang mengedepankan tampilan untuk mobile device (Handphone, smartphone dll.) guna mempercepat dan mempermudah pengembangan website. Bootstrap menyediakan HTML, CSS dan Javascript siap pakai dan mudah untuk dikembangkan.

Perbedaan PDO dan MySQLi
Kenapa saya membahas ini? Karena pada catatan ini saya menggunakan PDO untuk melakukan koneksi dan query ke database MySQL nya. Berikut ini perbedaan keduanya yang saya ambil dari blog lain :

  1. PDO memiliki kelebihan yaitu mendukung 12 Jenis Database dengan script yang sama. Hanya sedikit perubahan query-nya. kekurangannya yaitu Hanya bisa digunakan dengan model Object Oriented.
  2. MySQLi memiliki kelebihan yaitu Mendukung penggunaan secara prosedural maupun Object Oriented. Kekuranganya yaitu Harus melakukan perubahan pada script dan query-nya jika akan menggunakan database selain MySQL.

DEMO
Sebelum masuk ke tutorialnya. Mungkin ada yang mau lihat demonya terlebih dahulu. Silahkan klik link berikut untuk melihat demonya : Lihat Demo.


STEP 1 – PERSIAPAN
Berikut ini adalah hal-hal yang harus dipersiapkan :

  1. Download JQUERY, klik link berikut : Download.
  2. Download Bootstrap, klik link berikut : Download.
  3. Buat sebuah folder baru dengan nama search_ajax, lalu simpan pada folder xampp/htdocs/.
  4. Buat sebuah folder dengan nama css, lalu simpan pada folder xampp/htdocs/search_ajax/.
  5. Buat sebuah folder dengan nama js, lalu simpan pada folder xampp/htdocs/search_ajax/.
  6. Buat sebuah folder dengan nama foto, lalu simpn pada folder xampp/htdocs/search_ajax/. Folder ini digunakan untuk menampung foto user karena pada tutorial ini sruktur tabelnya terdapat foto user nya.
  7. Esktrak file bootstrap.7z yang telah didownload tadi.
  8. Copy and paste folder fonts dari folder bootstrap yang telah diekstrak tadi ke folder xampp/htdocs/search_ajax/.
  9. Copy and paste file bootstrap.min.css dari folder bootstrap/css/ yang telah diekstrak tadi ke folder xampp/htdocs/search_ajax/css/.
  10. Copy and paste file bootstrap.min.js dari folder bootstrap/js/ yang telah diekstrak tadi ke folder xampp/htdocs/search_ajax/js/.
  11. Rename file JQUERY yang telah di download tadi menjadi jquery.min.js, lalu copy and paste pada folder xampp/htdocs/search_ajax/js/.

STEP 2 – DATABASE
Pada step ini, kita akan membuat databasenya. ikuti langkah-langkah berikut ini :

  1. Buat sebuah database dengan nama mynotescode.
  2. Buat sebuah tabel dengan nama siswa. Struktur tabelnya sebagai berikut :
    Struktur Tabel - Cara Membuat Pencarian Tanpa Refresh Halaman dengan PHP dan AJAX

    CREATE TABLE IF NOT EXISTS `siswa` (
      `nis` varchar(11) NOT NULL,
      `nama` varchar(50) NOT NULL,
      `jenis_kelamin` varchar(10) NOT NULL,
      `telp` varchar(15) NOT NULL,
      `alamat` text NOT NULL,
      `foto` varchar(200) NOT NULL,
      PRIMARY KEY (`nis`)
    )

STEP 3 – KONEKSI DATABASE
Pada step ini, kita akan membuat file koneksi.php yang berfungsi untuk menghubungkan dengan database MySQL. Silahkan buat file koneksi.php, lalu simpan di folder xampp/htdocs/search_ajax/. Berikut ini kodenya :

<?php
$host = 'localhost'; // Nama hostnya
$username = 'root'; // Username
$password = ''; // Password (Isi jika menggunakan password)
$database = 'mynotescode'; // Nama databasenya

// Koneksi ke MySQL dengan PDO
$pdo = new PDO('mysql:host='.$host.';dbname='.$database, $username, $password);
?>

STEP 4 – VIEW
Langkah selanjutnya adalah membuat 1 buah file yang berguna sebagai template utamanya. Buat sebuah file dengan nama index.php, lalu simpan pada folder xampp/htdocs/search_ajax/. Berikut tampilan dan kodenya :

View - Cara Membuat Pencarian Tanpa Refresh Halaman dengan PHP dan AJAX

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Pencarian Dengan PHP dan AJAX</title>

    <!-- Load File bootstrap.min.css yang ada difolder css -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
    .align-middle{
      vertical-align: middle !important;
    }
    </style>
  </head>
  <body>
    <!-- Membuat Menu Header / Navbar -->
    <nav class="navbar navbar-inverse" role="navigation">
      <div class="container-fluid">
        <div class="navbar-header">
          <a class="navbar-brand" href="#" style="color: white;"><b>Pencarian Dengan PHP dan AJAX</b></a>
        </div>
        <p class="navbar-text navbar-right hidden-xs" style="color: white;padding-right: 10px;">
          FOLLOW US ON &nbsp;
          <a target="_blank" style="background: #3b5998; padding: 0 5px; border-radius: 4px; color: #f7f7f7; text-decoration: none;" href="https://www.facebook.com/mynotescode">Facebook</a> 
          <a target="_blank" style="background: #00aced; padding: 0 5px; border-radius: 4px; color: #ffffff; text-decoration: none;" href="https://twitter.com/mynotescode">Twitter</a> 
          <a target="_blank" style="background: #d34836; padding: 0 5px; border-radius: 4px; color: #ffffff; text-decoration: none;" href="https://plus.google.com/118319575543333993544">Google+</a>
          <a target="_blank" style="background: #fff; padding: 0 5px; border-radius: 4px; color: #d34836; text-decoration: none;" href="https://www.youtube.com/channel/UCO394itv-u7Tn4CgI3bMYIg">YouTube</a>
        </p>
      </div>
    </nav>
    
    <div style="padding: 0 15px;">
      <!--
      -- Buat sebuah div dengan class row
      -- class row ini berfungsi untuk membagi-bagi layar
      -- di dalam bootstrap, 1 layar penuh (dari kiri ke kanan) dibagi menjadi 12 bagian / Kolom
      -- Atau lebih tepatnya sering disebut dengan GRID
      -- col-xs-12 artinya jika ukuran layar < 768px, maka gunakan 12 kolom
      -- col-sm-6 artinya jika ukuran layar >= 768px, maka gunakan 6 kolom
      -- Untuk lebih jelasnya soal Grid, silahkan buka link ini : http://viid.me/qb4V8P
      -->
      <div class="row">
        <div class="col-xs-12 col-sm-6">
          <!--
          -- Input Group adalah salah satu komponen yang disediakan bootstrap
          -- Untuk lebih jelasnya soal Input Group, silahkan buka link ini : http://viid.me/qb4Mup
          -->
          <div class="input-group">
            <!-- Buat sebuah textbox dan beri id keyword -->
            <input type="text" class="form-control" placeholder="Pencarian..." id="keyword">
            
            <span class="input-group-btn">
              <!-- Buat sebuah tombol search dan beri id btn-search -->
              <button class="btn btn-primary" type="button" id="btn-search">SEARCH</button>
              <a href="" class="btn btn-warning">RESET</a>
            </span>
          </div>
        </div>
      </div>
      <br>
      
      <!--
      -- Buat sebuah div dengan id="view" yang digunakan untuk menampung data 
      -- yang ada pada tabel siswa di database
      -->
      <div id="view"><?php include "view.php"; ?></div>
    </div>
    
    <!-- Load File jquery.min.js yang ada difolder js -->
    <script src="js/jquery.min.js"></script>
    
    <!-- Load File bootstrap.min.js yang ada difolder js -->
    <script src="js/bootstrap.min.js"></script>
    
    <!-- Load file ajax.js yang ada di folder js -->
    <script src="js/ajax.js"></script>
  </body>
</html>

Pada kode diatas, kita akan me-load librari / plugin yang dibutuh kan seperti Jquery dan Bootstrap. Dan kita juga me-load sebuah file ajax.js yang akan kita buat pada langkah selanjutnya.

Kemudian pada kode index.php diatas, lihat kode pada baris ke 55. Disitu terdapat kode <?php include “view.php”; ?>, Kode tersebut berfungsi untuk me-load file view.php yang isinya adalah tabel yang menampung data dari hasil query ke tabel siswa di database. Sekarang kita akan coba buat file tersebut. Buat sebuah file dengan nama view.php, lalu simpan pada folder xampp/htdocs/search_ajax/. Berikut kodenya :

<div class="table-responsive">
  <table class="table table-bordered">
    <tr>
      <th class="text-center">NO</th>
      <th class="text-center">FOTO</th>
      <th>NIS</th>
      <th>NAMA</th>
      <th>JENIS KELAMIN</th>
      <th>TELP</th>
      <th>ALAMAT</th>
    </tr>
    <?php
    // Include / load file koneksi.php
    include "koneksi.php";
    
    // Cek apakah variabel $keyword tersedia
    // Artinya cek apakah user telah mengklik tombol search atau belum
    // variabel $keyword ini berasal dari file search.php,
    // dimana isinya adalah apa yang diinput oleh user pada textbox pencarian
    if(isset($keyword)){ // Jika veriabel $keyword ada (user telah mengklik tombol search)
      $param = '%'.$keyword.'%';
      
      // Buat query untuk menampilkan data siswa berdasarkan NIS / Nama / Jenis Kelamin / Telp / Alamat
      $sql = $pdo->prepare("SELECT * FROM siswa WHERE nis LIKE :ni OR nama LIKE :na OR jenis_kelamin LIKE :jk OR telp LIKE :t OR alamat LIKE :a");
      $sql->bindParam(':ni', $param);
      $sql->bindParam(':na', $param);
      $sql->bindParam(':jk', $param);
      $sql->bindParam(':t', $param);
      $sql->bindParam(':a', $param);
      $sql->execute(); // Eksekusi querynya
    }else{ // Jika user belum mengklik tombol search
      // Buat query untuk menampilkan semua data siswa
      $sql = $pdo->prepare("SELECT * FROM siswa");
      $sql->execute(); // Eksekusi querynya
    }
    
    $no = 1; // Untuk penomoran tabel, di awal set dengan 1
    while($data = $sql->fetch()){ // Ambil semua data dari hasil eksekusi $sql
    ?>
      <tr>
        <td class="align-middle text-center"><?php echo $no; ?></td>
        <td class="align-middle text-center">
          <img src="foto/<?php echo $data['foto']; ?>" width="80" height="80">
        </td>
        <td class="align-middle"><?php echo $data['nis']; ?></td>
        <td class="align-middle"><?php echo $data['nama']; ?></td>
        <td class="align-middle"><?php echo $data['jenis_kelamin']; ?></td>
        <td class="align-middle"><?php echo $data['telp']; ?></td>
        <td class="align-middle"><?php echo $data['alamat']; ?></td>
      </tr>
    <?php
      $no++; // Tambah 1 setiap kali looping
    }
    ?>
  </table>
</div>

Saya akan coba jelaskan sedikit mengenai kode diatas karena sebagian sudah saya jelaskan pada tiap-tiap kode dengan komentar.

include “koneksi.php”;
Kode tersebut berfungsi untuk me-load file koneksi.php.

$sql = $pdo->prepare(“SELECT * FROM siswa WHERE nis LIKE :ni OR nama LIKE :na OR jenis_kelamin LIKE :jk OR telp LIKE :t OR alamat LIKE :a”);
$sql->bindParam(‘:ni’, $param);
$sql->bindParam(‘:na’, $param);
$sql->bindParam(‘:jk’, $param);
$sql->bindParam(‘:t’, $param);
$sql->bindParam(‘:a’, $param);
$sql->execute();
Kode tersebut berfungsi untuk melakukan query ke database dan mengeksekusinya. Pada contoh diatas, kita akan melakukan query untuk menampilkan data siswa berdasarkan salah satu komponen (Berdasarkan NIS / Nama / Jenis Kelamin / Nomor Telepon / Alamat).

$sql = $pdo->prepare(“SELECT * FROM siswa”);
$sql->execute();
Sama seperti kode sebelumnya, hanya kode ini berguna untuk menampilkan semua data dari tabel siswa.

$data = $sql->fetch()
Kode tersebut berfungsi untuk mengambil semua data hasil query dan menampung data-data tersebut di dalam sebuah array lalu menyimpannya ke dalam variabel $data. Kode tersebut saya simpan di dalam sebuah kode while(….) yang berfungsi untuk melakukan proses perulangan sampai data terkahir dengan tujuan agar kita bisa menampilkan datanya satu per satu.

<tr>
  <td class="align-middle text-center"><?php echo $no; ?></td>
  <td class="align-middle text-center">
    <img src="foto/<?php echo $data['foto']; ?>" width="80" height="80">
  </td>
  <td class="align-middle"><?php echo $data['nis']; ?></td>
  <td class="align-middle"><?php echo $data['nama']; ?></td>
  <td class="align-middle"><?php echo $data['jenis_kelamin']; ?></td>
  <td class="align-middle"><?php echo $data['telp']; ?></td>
  <td class="align-middle"><?php echo $data['alamat']; ?></td>
</tr>

Pada kode diatas terdapat variabel $data digunakan untuk mengambil isi dari field-field yang ada pada tabel siswa di database mynotescode. Pada kode diatas juga ada kode yang berada pada tanda [‘……’], kode tersebut harus sama dengan nama field yang ada pada tabel siswa.


STEP 5 – AJAX
Selanjutnya kita akan membuat file ajax nya yang berfungsi untuk mengirimkan data ke file proses search.php yang nanti akan kita buat pada step selanjutnya. Sekarang buat sebuah file baru dengan nama ajax.js, lalu simpan pada folder xampp/htdocs/search_ajax/js/. Berikut kodenya :

$(document).ready(function(){
  $("#btn-search").click(function(){ // Ketika tombol simpan di klik
    // Ubah text tombol search menjadi SEARCHING... 
    // Dan tambahkan atribut disable pada tombol nya agar tidak bisa diklik lagi
    $(this).html("SEARCHING...").attr("disabled", "disabled");
    
    $.ajax({
      url: 'search.php', // File tujuan
      type: 'POST', // Tentukan type nya POST atau GET
      data: {keyword: $("#keyword").val()}, // Set data yang akan dikirim
      dataType: "json",
      beforeSend: function(e) {
        if(e && e.overrideMimeType) {
          e.overrideMimeType("application/json;charset=UTF-8");
        }
      },
      success: function(response){ // Ketika proses pengiriman berhasil
        // Ubah kembali text button search menjadi SEARCH
        // Dan hapus atribut disabled untuk meng-enable kembali button search nya
        $("#btn-search").html("SEARCH").removeAttr("disabled");
        
        // Ganti isi dari div view dengan view yang diambil dari search.php
        $("#view").html(response.hasil);
      },
      error: function (xhr, ajaxOptions, thrownError) { // Ketika terjadi error
        alert(xhr.responseText); // munculkan alert
      }
    });
  });
});

Akan saya jelaskan sedikit mengenai ajax, karena sebagian besar sudah saya jelaskan lewat kode diatas dengan komentar.

  • url : diisi dengan url file yang akan dituju
  • type :  diisi dengan method yang ingin digunakan. isi dengan GET atau POST
  • data : data yang akan dikirim ke file yang dituju
  • success : function(){} : ketika proses pengiriman selesai, lakukan aksi
  • error : function(){} : ketika terjadi error, lakukan aksi

untuk penjelasan lebih lengkap mengenai atiribut yang ada di JQUERY AJAX, klik disini.


 STEP 6 – PROSES PENCARIAN
Langkah terakhir adalah membuat file untuk PHP memproses pencariannya. Buat sebuah file dengan nama search.php, lalu simpan pada folder xampp/htdocs/search_ajax/. Berikut kodenya :

<?php
$keyword = $_POST['keyword']; // Ambil data keyword yang dikirim dengan AJAX

// Load view.php
ob_start();
include "view.php";
$html = ob_get_contents(); // Masukan isi dari view.php ke dalam variabel $html
ob_end_clean();

// Buat array dengan index hasil dan value nya $html
// Lalu konversi menjadi JSON
echo json_encode(array('hasil'=>$html));
?>

Mungkin kode diatas tidak perlu saya jelaskan lagi karena sudah saya jelaskan pada masing-masing kode dengan komentar.


Sekian untuk catatan kali ini. Semoga catatan ini bisa bermanfaat. Apabila ada yang ingin ditanyakan, langsung tanyakan saja lewat form komentar dibawah ini. Jangan lupa LIKE & SHARE nya hehe. Terimakasih.


SOURCE CODE
Untuk mengunduh source code nya, klik salah satu link dibawah ini
– Download versi PDO : Link download yang sesuai tutorial ini yakni menggunakan fungsi PDO untuk query ke databasenya
– Download versi MySQLi : Link download untuk Anda yang ingin source code versi MySQLi dari tutorial ini


SUMBER & REFERENSI
Dokumentasi Bootstrap : http://getbootstrap.com/getting-started/
http://ekajogja.com/mengenal-javascript-ajax-jquery-angularjs-dan-node-js/
http://dul.web.id/bootstrap/3/tuts-tips/belajar-bootstrap-untuk-pemula.php
http://kursuswebprogramming.com/beda-pdo-dan-mysqli-di-php/
Tutorial membuat pencarian tanpa refresh halaman dengan php dan jquery ajax, Tutoria membuat pencarian tanpa reload halaman dengan php dan jquery ajax, cara mudah membuat pencarian tanpa harus refresh halaman dengan php mysql dan jquery ajax. Source ciode pencarian tanpa refresh halaman dengan php dan jquery ajax

Pencarian

(Total : 49,752 viewers, 1 viewers today)
cara-membuat-pencarian-tanpa-refresh-halaman-dengan-php-dan-ajax

ABOUT THE AUTHOR

Interested in android programming, long time focused on web development. Visit My Profile Site at www.rizaldimaulidia.com

POST YOUR COMMENTS

Your email address will not be published. Required fields are marked *

Name *

Email *

Website

42 Comments

  1. Dimas Priyono

    bro, utk source code ga bsa di download. bad gateway. ada alternatif link download lain? trims

    • coba download didalam browser dengan mode “Incognito” om. saya coba soalnya ini tidak ada masalah.

  2. Bedjo_Jr

    Cara input data nya gimana yaa om.??
    maklum cupu…
    makasih yaaa

  3. Limbong17

    Bro mau nny,
    data bisa di tampilkan dr view, tapi pas gw coba search kok ga ad nongol apa2 ya

  4. NURUL HIDAYATULLAH

    Salam kenal Mas.
    Sebelumnya saya ucapkan terima kasih atas tutorialnya. Sangat Bermanfaat

    Mau nanya, kalau menampilkan data dengan menggunakan 2 textbox, kodenya gimana dan bagian mana yang harus saya ganti.
    Tuturial ini kan hanya menggunakan 1 textbox saja.

    Mohon bantuannya.

    • Salam kenal juga mba.
      Sama-sama mba senang bisa membantu hehe

      Untuk itu lebih baik mba nya coba pahami dulu tutorial ini, soalnya untuk menambah 1 textbox lagi ada beberapa hal yang harus di ubah dan di sesuaikan mba

      • NURUL HIDAYATULLAH

        In Sya Allah, saya sudah paham.

        Saya punya Masalah.
        Alurnya seperti ini.
        Textbox1 = 123456
        Textbox2 = XA
        Button Cari

        Setelah textbox1,textbox 2 terisi Data Dan button cari diklik, maka data yang ada hubungannya dengan textbox akan ditampilkan di Tabel.

        Mohon bantuan nya.

  5. dewi septiani

    mas, knapa pada saat buka index.php semua tabel gak muncul? padahal sudah diganti jadi

    terus pas di klik search, muncul ini :

    $html));
    ?>

    dan ada button OKnya, saat button Oknya diklik enggak ada hasil tabel yang dicari..
    mohon penjelasannya mas..

  6. ErdinBlaze29

    mas mau tanya kalau error ini kenapa ya?

    Notice: Undefined variable: pdo in C:\xampp\htdocs\kalender\kalender3\view.php on line 35

    Fatal error: Uncaught Error: Call to a member function prepare() on null in C:\xampp\htdocs\kalender\kalender3\view.php:35 Stack trace: #0 C:\xampp\htdocs\kalender\kalender3\nyoba.php(82): include() #1 {main} thrown in C:\xampp\htdocs\kalender\kalender3\view.php on line 35

  7. noise_face

    Gan bagaimana caranya klo pas tampilan pertama tabel keseluruhan tidak ditampilkan , yg ditampilkan hanya tombol search saja ,, dan setelah kita klik tombol search baru tampil apa yg kita cari, apa yang harus drubah gan?

    • Rizaldi Maulidia Achmad

      tinggal ubah skrip ini :
      <div id="view"><?php include "view.php"; ?></div>

      menjadi ini :
      <div id="view"></div>

  8. Mrh21347

    Gan, kalo ane tambahin create, update, sama delete data bisa?

    • Rizaldi Maulidia Achmad

      Sangat bisa om

  9. yusimega

    ini klo sya masukkan ke program saya..dengan versi bootstrap yang berbeda…bagaimana ?

    • Rizaldi Maulidia Achmad

      Kalau bootstrap itu kan hanya untuk pemanis saja, yang penting itu fungsi php atau ajax nya. Disini saya pakai bootstrap 3, kalau mba pakai bootstrap 2 atau 4, tinggal sesuakan sesuai versi bootstrap yang mba pakai

  10. Bayu rachmad M

    Kalo saya mau mengganti nama file view.php dan search.php
    Kira2 perintah mana saja yng harus saya rubah

    • Rizaldi Maulidia Achmad

      Pada file index.php, di line 75. ganti skrip berikut :
      include “view.php”;
      .
      Pada file ajax.js, di line 8. ganti skrip berikut :
      url: ‘search.php’

  11. Umar Hadi Siswanto

    variable $pdo kok gak kebaca ya mas?

    • Rizaldi Maulidia Achmad

      tidak kebaca gimana om? apa ada error yang keluar? apa errornya?

      • Umar Hadi Siswanto

        Notice: Undefined variable: pdo in C:\xampp\htdocs\aplikasi_penjualan_php_mysql-master\admin\barang.php on line 43

        Fatal error: Call to a member function prepare() on a non-object in C:\xampp\htdocs\aplikasi_penjualan_php_mysql-master\admin\barang.php on line 43

        seperti ini mas, saya lihat $pdo harusnya ada di koneksi.php dan itu sudah saya lakukan tetap saja undefined

        • Rizaldi Maulidia Achmad

          coba kirim file barang.php nya sama file koneksi nya om, saya mau lihat. kirim via fans page fb kami saja

          • Umar Hadi Siswanto

            saya tidak punya akun facebook mas, email saja bisa?

  12. Tomas Herianto

    Permisi nanya Pak, jika hasil search ditambahkan checkbox untuk selanjutnya diolah gimana ya??
    Apakah ada artikel khusus untuk kasus itu?

    • Rizaldi Maulidia Achmad

      ditambahkan saja pak. fungsi checkbox tersebut untuk apa?

  13. El Sadat

    Gan..
    Saya coba paki “search” yang agan buat tapi databasenya saya ganti mengunakan database yang saya buat.

    Masalahnya dia “search” tidak bisa menampilkan nama yang ada dalam daftar tabel.

    • Rizaldi Maulidia Achmad

      apa ada error yang muncul?

  14. gregpudya

    gan gimana ya caranya nampilin hasil pencarian tapi jumlah paginationnya ngikutin hasil pencarian? contoh semua data jumlah 20 ada 2 halaman, setelah dicari dengan keyword tertentu hanya menampilkan 5 data dan paginationnya otomatis cuman menjadi 1 halaman, thxx

    • Rizaldi Maulidia Achmad

      berarti skrip pagination nya juga harus di buat di file hasil pencariannya om. nanti tinggal sesuaikan skrip query sql untuk menghitung total datanya

  15. Dazul Hanzu

    Zal usul yah hehe ,,tutorial cara bikin charts menggunakan bootstrap, mengambil datanya menggunakan OOP anu pake public function () tea hehe nuhun

    • Rizaldi Maulidia Achmad

      pakai HighChart om coba

  16. MUNANJAR

    : SQLSTATE[HY093]: Invalid parameter number: number of bound variables does not match number of tokens selalu muncul begini

  17. MUNANJAR

    $sql = $pdo->prepare(“SELECT * FROM siswa WHERE tsuratdari LIKE :sd OR nama LIKE :na OR jenis_kelamin LIKE :jk OR telp LIKE :t OR alamat LIKE :a”);
    $sql->bindParam(‘:sd’, $param);
    $sql->bindParam(‘:na’, $param);
    $sql->bindParam(‘:jk’, $param);
    $sql->bindParam(‘:t’, $param);
    $sql->bindParam(‘:a’, $param);
    $sql->execute(); // Eksekusi querynya

    TOLONG DONG DIJELASIN LEBIH DETIL DI BAGIAN TSB. SAYA BINGUNG KETIKA SAYA GANTI NIS NAMA KOK TIDAK MUNCUL. KIRA KIRA ADA SALAH DIMANA?

    • Rizaldi Maulidia Achmad

      Akan saya beri penjelasan sedikit, contoh saya punya query sebagai berikut :
      $sql = $pdo->prepare(“SELECT * FROM namatabel WHERE kolom1=:param1 AND kolom2=:param2 AND kolom3=:param3”);
      $sql->bindParam(‘:param1’, $isi_param1); // Isi dari parameter 1
      $sql->bindParam(‘:param2’, $isi_param2); // Isi dari parameter 2
      $sql->bindParam(‘:param3’, $isi_param3); // Isi dari parameter 3

      Dalam contoh saya diatas terdapat 3 parameter.

      Untuk kasus yg om punya. bisa saya lihat struktur tabel siswa nya?
      Saya lihat pada query yg om buat, pada bagian ini : WHERE tsuratdari LIKE
      Yakin itu nama kolomnya “tsuratdari” ???? bukan “suratdari” ???

      Mohon maaf baru sempat saya balas sekarang

    • Rizaldi Maulidia Achmad

      Hahahahha ntaap jiwaaa

NOTE ARCHIVES