Recent

CRUD Sederhana Menggunakan PHP-MySQL dengan MySQLi extension

Assalamu’alaikum..
Halo teman-teman, pada kesempatan kali ini saya akan berbagi tutorial tentang cara membuat aplikasi CRUD sederhana menggunakan PHP dan MySQL dengan mysqli extensions.
Sebelum membahas langkah-langkahnya ada baiknya kita mengenal apa itu aplikasi CRUD. CRUD merupakan singkatan dari Create, Read, Update dan Delete. Sesuai dengan namanya, aplikasi CRUD merupakan aplikasi yang digunakan untuk menginput data ke database (Create), menampilkan data dari database (Read), mengedit/mengupdate data pada database (Update) dan menghapus data dari database (Delete).
Tutorial ini saya tujukan terutama bagi teman-teman yang mungkin baru dalam mempelajari PHP. Memahami konsep CRUD sangat penting jika kita ingin membuat sebuah aplikasi. Tanpa memahami konsep ini, kita tidak bisa membuat aplikasi bahkan yang sangat sederhana sekalipun, kecuali jika aplikasi yang kita buat tidak berhubungan dengan database.
Bagi teman-teman yang belum menguasai dasar HTML, PHP dan MySQL, saya sarankan untuk mempelajarinya terlebih dahulu sebelum mengikuti tutorial ini. Akan lebih baik lagi jika Anda juga menguasai CSS. Karena di sini saya tidak akan menjelaskan hal-hal yang bersifat dasar. Jika teman-teman mengikuti tutorial ini, saya asumsikan teman-teman sudah menguasai dasar-dasar HTML, PHP dan MySQL.
Kali ini kita akan belajar membuat aplikasi untuk mengolah biodata mahasiswa. Berikut ini gambaran hasil aplikasi yang akan kita buat:
Halaman utama menampilkan data mahasiswa:


Halaman untuk menampilkan data
Halaman untuk menampilkan data

Halaman untuk menginput data:


Halaman untuk menginput data
Halaman untuk menginput data

Halaman untuk mengedit data:


Halaman untuk edit data
Halaman untuk edit data

Tampilan ketika akan menghapus data:


Tampilan ketika akan menghapus data
Tampilan ketika akan menghapus data

Adapun file-file yang nantinya akan kita buat adalah sebagai berikut:


File-file yang akan dibuat
File-file yang akan dibuat

Oke langsung saja, selanjutnya kita akan membahas langkah-langkahnya.

Langkah 1 : Menyiapkan Database

Langkah pertama yang harus kita lakukan adalah menyiapkan database terlebih dahulu. Database ini akan digunakan untuk menyimpan data dari aplikasi crud yang kita buat.
Buatlah database dengan nama crud_sederhana, bisa dengan menggunakan Command Promt atau dengan phpMyAdmin. Setelah database dibuat, langkah selanjutnya yaitu membuat tabel dengan nama mahasiswa ke dalam database tadi.
Struktur tabel mahasiswa adalah sebagai berikut:


Tabel Mahasiswa
Tabel Mahasiswa

Berikut ini adalah script untuk membuat tabel mahasiswa:
CREATE TABLE `mahasiswa` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `nim` char(8) DEFAULT NULL,
  `nama` varchar(100) DEFAULT NULL,
  `fakultas` varchar(50) DEFAULT NULL,
  `jurusan` varchar(50) DEFAULT NULL,
  `ipk` decimal(3,2) DEFAULT NULL,
  PRIMARY KEY (`id`)
);

Langkah 2 : Koneksi ke Database

Sebelum melakukan langkah ini kita harus membuat folder untuk menyimpan file-file yang nantinya akan kita buat. Buat folder dengan nama crud_sederhana di dalam folder htdocs.
Langkah selanjutnya yaitu membuat file untuk melakukan koneksi ke database. Buat file baru dengan nama koneksi.php, simpan ke dalam folder crud-sederhana tadi, kemudian isi dengan kode dibawah ini:
<?php
  // buat koneksi dengan database mysql
  $host = "localhost";
  $user = "root";
  $pass = "";
  $name = "crud_sederhana";
  $link = mysqli_connect($host,$user,$pass,$name);
  //periksa koneksi, tampilkan pesan kesalahan jika gagal
  if(!$link){
    die ("Koneksi dengan database gagal: ".mysql_connect_errno().
    " - ".mysql_connect_error());
  }
?>
Silahkan sesuaikan variabel $host dan $user sesuai dengan komputer Anda.
File koneksi.php ini nantinya akan kita panggil ke dalam file-file lainnya dengan fungsi include() agar setiap file bisa terhubung ke database.

Langkah 3 : Menampilkan Data

Langkah ketiga yaitu membuat file untuk menampilkan data. Karena akan kita jadikan sebagai halaman utama maka kita beri nama file ini dengan nama index.php. Setelah membuat file index.php di dalam folder crud_sederhana, isilah dengan kode berikut:
<?php
  // memanggil file koneksi.php untuk melakukan koneksi database
  include 'koneksi.php';
?>

<!DOCTYPE html>
<html>
  <head>
    <style>
      table{
        width: 840px;
        margin: auto;
      }
      h1{
        text-align: center;
      }
    </style>
  </head>
  <body>
    <h1>Tabel Biodata Mahasiswa</h1>
    <center><a href="input.php">Input Data &Gt; </a></center>
    <br/>
    <table border="1">
      <tr>
        <th>No</th>
        <th>NIM</th>
        <th>Nama</th>
        <th>Fakultas</th>
        <th>Jurusan</th>
        <th>IPK</th>
        <th>Pilihan</th>
      </tr>
      <?php
      // jalankan query untuk menampilkan semua data diurutkan berdasarkan nim
      $query = "SELECT * FROM mahasiswa ORDER BY nim ASC";
      $result = mysqli_query($link, $query);
      //mengecek apakah ada error ketika menjalankan query
      if(!$result){
        die ("Query Error: ".mysqli_errno($link).
           " - ".mysqli_error($link));
      }

      //buat perulangan untuk element tabel dari data mahasiswa
      $no = 1; //variabel untuk membuat nomor urut
      // hasil query akan disimpan dalam variabel $data dalam bentuk array
      // kemudian dicetak dengan perulangan while
      while($data = mysqli_fetch_assoc($result))
      {
        // mencetak / menampilkan data
        echo "<tr>";
        echo "<td>$no</td>"; //menampilkan no urut
        echo "<td>$data[nim]</td>"; //menampilkan data nim
        echo "<td>$data[nama]</td>"; //menampilkan data nama
        echo "<td>$data[fakultas]</td>"; //menampilkan data fakultas
        echo "<td>$data[jurusan]</td>"; //menampilkan data jurusan
        echo "<td>$data[ipk]</td>"; //menampilkan data ipk
        // membuat link untuk mengedit dan menghapus data
        echo '<td>
          <a href="edit.php?id='.$data['id'].'">Edit</a> /
          <a href="hapus.php?id='.$data['id'].'"
          onclick="return confirm(\'Anda yakin akan menghapus data?\')">Hapus</a>
        </td>';
        echo "</tr>";
        $no++; // menambah nilai nomor urut
      }
      ?>
    </table>
  </body>
</html>
Apabila index.php ini kita jalankan di web browser maka akan terlihat tampilan seperti ini:
Tabel Mahasiswa
Seperti yang kita lihat, tabel mahasiswa di atas masih kosong karena memang kita belum memasukkan data apapun ke dalam tabel. Untuk itu pada langkah selanjutnya kita akan membuat sebuah halaman untuk memasukkan data pada tabel mahasiswa.

Langkah 4 : Memasukkan Data

Pada tahap ini kita akan membuat dua buah file. File yang pertama berisi sebuah form untuk memasukkan data yang akan kita beri nama input.php. File yang kedua berfungsi untuk memproses data yang telah dimasukkan pada form input.php. File ini kita beri nama input_proses.php.
Berikut ini adalah tampilan kode pada file input.php:
<!DOCTYPE html>
<html>
  <head>
    <style>
      h1{
        text-align: center;
      }
      .container{
        width: 400px;
        margin: auto;
      }
    </style>
  </head>
  <body>
    <h1>Input Data</h1>
    <div class="container">
      <form id="form_mahasiswa" action="input_proses.php" method="post">
        <fieldset>
        <legend>Input Data Mahasiswa</legend>
          <p>
            <label for="nim">NIM : </label>
            <input type="text" name="nim" id="nim" placeholder="Contoh: 12345678">
          </p>
          <p>
            <label for="nama">Nama : </label>
            <input type="text" name="nama" id="nama">
          </p>
          <p>
            <label for="fakultas" >Fakultas : </label>
              <select name="fakultas" id="fakultas">
                <option value="Kedokteran">Kedokteran </option>
                <option value="MIPA">MIPA</option>
                <option value="Ekonomi">Ekonomi</option>
                <option value="Teknik">Teknik</option>
                <option value="Sastra">Sastra</option>
                <option value="Hukum">Hukum</option>
              </select>
          </p>
          <p>
            <label for="jurusan">Jurusan : </label>
            <input type="text" name="jurusan" id="jurusan">
          </p>
          <p >
            <label for="ipk">IPK : </label>
            <input type="text" name="ipk" id="ipk" placeholder="Contoh: 2.75">
          </p>

        </fieldset>
        <p>
          <input type="submit" name="input" value="Tambah Data">
        </p>
      </form>
    </div>
  </body>
</html>
Tampilan halaman input.php:
08
Saya rasa kode di atas cukup mudah dipahami karena hanya berupa html. Pada kode di atas terdapat form dengan action = “input_proses.php”, artinya ketika form tersebut disubmit maka data yang diinputkan pada form akan diproses oleh file input_proses.php
Tampilan kode input_proses.php adalah sebagai berikut:
<?php
// memanggil file koneksi.php untuk melakukan koneksi database
include 'koneksi.php';

// mengecek apakah tombol input dari form telah diklik
if (isset($_POST['input'])) {

 // membuat variabel untuk menampung data dari form
 $nim = $_POST['nim'];
  $nama = $_POST['nama'];
  $fakultas = $_POST['fakultas'];
  $jurusan = $_POST['jurusan'];
  $ipk = (float) $_POST['ipk'];

  // jalankan query INSERT untuk menambah data ke database
  $query = "INSERT INTO mahasiswa VALUES (NULL, '$nim', '$nama', '$fakultas','$jurusan',$ipk)";
  $result = mysqli_query($link, $query);
  // periska query apakah ada error
  if(!$result){
      die ("Query gagal dijalankan: ".mysqli_errno($link).
           " - ".mysqli_error($link));
  }
}

// melakukan redirect (mengalihkan) ke halaman index.php
header("location:index.php");
?>
File input_proses.php akan mengambil data yang diinput dari form pada halaman input.php kemudian memasukkan data tersebut ke dalam database menggunakan query INSERT INTO.
Sampai tahap ini kita sudah bisa menginput data ke dalam tabel mahasiswa, namun kita belum bisa melakukan edit data dan hapus data.

Langkah 5 : Mengupdate / Mengedit Data

Langkah selanjutnya yaitu membuat halaman untuk update/edit data. Sama seperti sebelumnya, pada tahap ini kita akan membuat dua file: file untuk membuat form dan file untuk memproses form.
Sekarang buat file untuk membuat form update data dengan nama edit.php. kemudian isikan kode berikut:
<?php
  // memanggil file koneksi.php untuk membuat koneksi
  include 'koneksi.php';

  // mengecek apakah di url ada nilai GET id
  if (isset($_GET['id'])) {
    // ambil nilai id dari url dan disimpan dalam variabel $id
    $id = ($_GET["id"]);

    // menampilkan data mahasiswa dari database yang mempunyai id=$id
    $query = "SELECT * FROM mahasiswa WHERE id='$id'";
    $result = mysqli_query($link, $query);
    // mengecek apakah query gagal
    if(!$result){
      die ("Query Error: ".mysqli_errno($link).
         " - ".mysqli_error($link));
    }
    // mengambil data dari database dan membuat variabel" utk menampung data
    // variabel ini nantinya akan ditampilkan pada form
    $data = mysqli_fetch_assoc($result);
    $nim = $data["nim"];
    $nama = $data["nama"];
    $fakultas = $data["fakultas"];
    $jurusan = $data["jurusan"];
    $ipk = $data["ipk"];

  } else {
    // apabila tidak ada data GET id pada akan di redirect ke index.php
    header("location:index.php");
  }

?>
<!DOCTYPE html>
<html>
  <head>
    <style>
      h1{
        text-align: center;
      }
      .container{
        width: 400px;
        margin: auto;
      }
    </style>
  </head>
  <body>
    <h1>Edit Data</h1>
    <div class="container">
      <form id="form_mahasiswa" action="edit_proses.php" method="post">
        <input type="hidden" name="id" value="<?php echo $id; ?>">
        <fieldset>
        <legend>Edit Data Mahasiswa</legend>
          <p>
            <label for="nim">NIM : </label>
            <input type="text" name="nim" id="nim" value="<?php echo $nim ?>">
          </p>
          <p>
            <label for="nama">Nama : </label>
            <input type="text" name="nama" id="nama" value="<?php echo $nama ?>">
          </p>
          <p>
            <label for="fakultas" >Fakultas : </label>
              <select name="fakultas" id="fakultas">
                <option value="Kedokteran" <?php if($data['fakultas'] == 'Kedokteran'){ echo 'selected'; } ?>>
                Kedokteran </option>
                <option value="MIPA" <?php if($data['fakultas'] == 'MIPA'){ echo 'selected'; } ?>>
                MIPA</option>
                <option value="Ekonomi" <?php if($data['fakultas'] == 'Ekonomi'){ echo 'selected'; } ?>>
                Ekonomi</option>
                <option value="Teknik" <?php if($data['fakultas'] == 'Teknik'){ echo 'selected'; } ?>>
                Teknik</option>
                <option value="Sastra" <?php if($data['fakultas'] == 'Sastra'){ echo 'selected'; } ?>>
                Sastra</option>
                <option value="Hukum" <?php if($data['fakultas'] == 'Hukum'){ echo 'selected'; } ?>>
                Hukum</option>
              </select>
          </p>
          <p>
            <label for="jurusan">Jurusan : </label>
            <input type="text" name="jurusan" id="jurusan" value="<?php echo $jurusan ?>">
          </p>
          <p >
            <label for="ipk">IPK : </label>
            <input type="text" name="ipk" id="ipk" value="<?php echo $ipk ?>">
          </p>
        </fieldset>
        <p>
          <input type="submit" name="edit" value="Update Data">
        </p>
      </form>
  </div>
  </body>
</html>
Tampilan halaman edit:
09
Halaman edit data ini dapat diakses melalui tombol link yang terdapat pada kolom pilihan Tabel Biodata Mahasiswa pada halaman index.php.
01-copy
Link tersebut mengandung query stringQuery string adalah sebutan untuk karakter tambahan di belakang URL atau di belakang penulisan alamat dari sebuah situs. Contohnya apabila kita mengeklik tombol edit pada mahasiswa dengan id = 3, maka akan menuju ke alamat:
http://localhost/crud_sederhana/edit.php?id=3
Tambahan teks “?id=3” inilah yang disebut dengan query string. Karakter tanda tanya (?) merupakan pembatas antara alamat situs dengan query string.
Pada contoh tersebut berarti kita mengirim data berupa variabel “id” yang bernilai “3” ke dalam halaman http://localhost/crud_sederhana/edit.php. Data ini bisa diakses menggunakan variabel $_GET[”id”].
File edit.php akan mengambil nilai $_GET[”id”] dan disimpan pada variabel $id. Setelah itu data mahasiswa yang akan diedit ditampilkan menggunakan query "SELECT * FROM mahasiswa WHERE id='$id'". Hasil query kemudian disimpan pada beberapa variabel. Variabel-variabel ini digunakan untuk mengisi atribut value pada form agar data tersebut dapat tampil di form.
Sekarang buat file edit_proses.php. Lalu isikan kode berikut:
<?php
// mengecek apakah tombol edit telah diklik
if (isset($_POST['edit'])) {
  // buat koneksi dengan database
  include("koneksi.php");

  // membuat variabel untuk menampung data dari form edit
  $id = $_POST['id'];
  $nim = $_POST['nim'];
 $nama = $_POST['nama'];
 $fakultas = $_POST['fakultas'];
 $jurusan = $_POST['jurusan'];
 $ipk = (float) $_POST['ipk'];

  //buat dan jalankan query UPDATE
  $query  = "UPDATE mahasiswa SET ";
  $query .= "nim = '$nim', nama = '$nama', ";
  $query .= "fakultas='$fakultas', ";
  $query .= "jurusan = '$jurusan', ipk=$ipk ";
  $query .= "WHERE id = '$id'";

  $result = mysqli_query($link, $query);

  //periksa hasil query apakah ada error
  if(!$result) {
    die ("Query gagal dijalankan: ".mysqli_errno($link).
       " - ".mysqli_error($link));
  }
}

//lakukan redirect ke halaman index.php
header("location:index.php");

?>
File edit_proses.php akan mengambil data yang diinput dari form pada halaman edit.php kemudian melakukan update data menggunakan query UPDATE.

Langkah 6 : Menghapus Data

Langkah terakhir yaitu membuat halaman untuk menghapus data. Buat file bernama hapus.php kemudian isi dengan kode berikut:
<?php
// buka koneksi dengan MySQL
  include("koneksi.php");

  //mengecek apakah di url ada GET id
  if (isset($_GET["id"])) {

    // menyimpan variabel id dari url ke dalam variabel $id
    $id = $_GET["id"];

    //jalankan query DELETE untuk menghapus data
    $query = "DELETE FROM mahasiswa WHERE id='$id' ";
    $hasil_query = mysqli_query($link, $query);

    //periksa query, apakah ada kesalahan
    if(!$hasil_query) {
      die ("Gagal menghapus data: ".mysqli_errno($link).
           " - ".mysqli_error($link));
    }
  }
  // melakukan redirect ke halaman index.php
  header("location:index.php");
?>
Sama seperti halaman edit.php, halaman hapus.php ini dapat diakses melalui link yang terdapat pada kolom Pilihan pada Tabel Biodata Mahasiswa di halaman index.php.
File hapus.php akan mengambil nilai id pada query string menggunakan variabel $_GET[“id”]. Nilai id ini digunakan untuk mengetahui data mahasiswa yang mana yang akan dihapus. Setelah itu data dihapus menggunakan query "DELETE FROM mahasiswa WHERE id='$id' ".
Sampai tahap ini kita telah selesai membuat aplikasi CRUD sederhana untuk mengolah data mahasiswa.

Semoga bermanfaat ...

CRUD Sederhana Menggunakan PHP-MySQL dengan MySQLi extension CRUD Sederhana Menggunakan PHP-MySQL dengan MySQLi extension Reviewed by Unknown on Juli 03, 2017 Rating: 5

Tidak ada komentar

Fashion

Join on Facebook