AndezNET

Gudang aplikasi web gratis, tips trick seputar teknologi terbaru dan jasa pembuatan aplikasi web, mobile dan desktop

Membuat CRUD mengunakan konsep OOP di PHP dengan tampilan Bootstrap

Membuat CRUD mengunakan konsep OOP di PHP dengan tampilan Bootstrap

Hai All ketemu lagi bersama saya portgastea , tutorial kali ini adalah Membuat CRUD mengunakan konsep OOP di PHP dengan tampilan Bootstrap, walaupun saya baru belajar konsep OOP di PHP saya ingin SHARE, barangkali aja bermanfaat.

Sebelumnya saya ingin menjelaskan alasan mengapa kita mesti dan mulai menerapkan konsep OOP.

  1. Konsep OOP memudahkan kita untuk menganalisa program yang kita akan buat. Ini akan sangat terasa kalau kita membuat  program besar dan riwet.
  2. Dengan OOP, proses reuse kode-kode yang kita buat untuk project yang hampir sama, mudah, karena kode yang kita buat rapih dan terstruktur. Sehingga untuk mengubah atau reuse kode gak pusing-pusing lagi.
  3. Konsepnya per modul. Pernah buat fungsi ato prosedur di C atau di PHP ? lalu kita tinggal panggil saja kan nama fungsinya. Kalau error pasti mudah diketahui karena terbaca dari fungsi yang kita panggil. Itulah maksudnya konsep per modul. Sehingga dengan OOP, kita dimudahkan untuk membuat dan membaca kode kita (efisiensi kode).
  4. Dengan OOP, kode-kode yang kita buat menjadi lebih rapih dan terstruktur.

 

OK langsung saja, pertama buat directory baru dengan nama crudoop atau terserah anda di htdocs lalu download Bootstrap dan masukan folder assets ke directory tersebut.

Pertama membuat database baru dengan nama crud_oop setelah itu buat tabel biodata seperti dibawah ini

CREATE TABLE IF NOT EXISTS `biodata` (
`id` int(11) NOT NULL,
  `nama` varchar(200) NOT NULL,
  `tmpt_lahir` varchar(40) NOT NULL,
  `tgl_lahir` date NOT NULL,
  `alamat` text NOT NULL,
  `telpon` varchar(15) NOT NULL
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=10 ;
 
--
-- Dumping data for table `biodata`
--
 
INSERT INTO `biodata` (`id`, `nama`, `tmpt_lahir`, `tgl_lahir`, `alamat`, `telpon`) VALUES
(3, 'asep', 'ciamis', '1989-07-01', 'sadsadsad', '09090909'),
(6, 'sutisna tea', 'jakarta', '1998-01-01', 'andeztea', '090909090'),
(7, 'dina maulidina', 'jakarta', '1999-01-01', 'sadsadsadasdasdd', '090900909'),
(8, 'wahyu', 'jakarta', '1999-02-02', 'sadasdadadasd', '98989898'),
(9, 'iman ', 'cianjur', '1999-01-01', 'pasirhuni', '0909090909090');
 
--
-- Indexes for dumped tables
--
 
--
-- Indexes for table `biodata`
--
ALTER TABLE `biodata`
 ADD PRIMARY KEY (`id`);

 

Kedua buat file php baru dengan nama koneksi.php lalu copy an script dibawah ini

<?php
//membuat class databse
class database {
    // properti
    private $dbHost = "localhost";
    private $dbUser = "root";
    private $dbPass = "12345";
    private $dbName = "crud_oop";
 
    // method koneksi MySQL
    function connectMySQL() {
        mysql_connect($this->dbHost, $this->dbUser, $this->dbPass);
        mysql_select_db($this->dbName) or die("Database tidak ada!");
    }
 
    // method tambah data (insert)	
    function tambahBiodata($nama,$tmpt_lahir,$tgl_lahir,$alamat,$telpon) {
 
        $query = "INSERT INTO biodata(nama,tmpt_lahir,tgl_lahir,alamat,telpon) VALUES ('$nama','$tmpt_lahir','$tgl_lahir','$alamat','$telpon')";
        $hasil = mysql_query($query);
 
        if ($hasil)
		  echo "<div class='alert alert-block alert-success'><strong><i></i> DATA BERHASIL DI SIMPAN</strong></div>";
 
        else
         echo "<div class='alert alert-block alert-danger'><strong><i></i> DATA GAGAL DI UPDATE</strong></div>";
		}
 
 
    // method tampil data 	
    function tampilBiodata() {
        $query = mysql_query("SELECT * FROM biodata ORDER BY id");
        while ($row = mysql_fetch_array($query))
            $data[] = $row;
        return $data;
    }
 
    // method hapus data
    function hapusBiodata($id_b) {
        $query = mysql_query("DELETE FROM biodata WHERE id='$id_b'");
		if ($query)
		    echo "<div class='alert alert-block alert-success'><strong><i></i> Data Biodata dengan ID " . $id_b . " sudah dihapus</strong></div>";
		else
			 echo "<div class='alert alert-block alert-danger'><strong><i></i>GAGAL DI HAPUS</strong></div>";
    }
 
    // method membaca data biodata
    function bacaDataBiodata($field, $id_b) {
        $query = "SELECT * FROM biodata WHERE id = '$id_b'";
        $hasil = mysql_query($query);
        $data = mysql_fetch_array($hasil);
        if ($field == 'nama')
            return $data['nama'];
		else if ($field == 'tmpt_lahir')
            return $data['tmpt_lahir'];
		else if ($field == 'tgl_lahir')
            return $data['tgl_lahir'];
        else if ($field == 'alamat')
            return $data['alamat'];
        else if ($field == 'telpon')
            return $data['telpon'];
    }
 
    // method untuk proses update data biodata
    function updateDataBiodata($id_b, $nama,$tmpt_lahir,$tgl_lahir,$alamat,$telpon) {
        $query = "UPDATE biodata SET nama='$nama',tmpt_lahir='$tmpt_lahir',tgl_lahir='$tgl_lahir', alamat ='$alamat', telpon='$telpon' WHERE id='$id_b'";
        $hasilupdate=mysql_query($query);
 
        if ($hasilupdate)
		    echo "<div class='alert alert-block alert-success'><strong><i></i> DATA BERHASIL DI UPDATE</strong></div>";
        else
            echo "<div class='alert alert-block alert-danger'><strong><i></i> DATA GAGAL DI UPDATE</strong></div>e";
    }
 
}
?>

Ketiga buat file index.php nya seperti gambar dibawah ini

index.php   
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Membuat CRUD mengunakan konsep OOP di PHP dengan tampilan Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
 
    <!-- Le styles -->
	    <link href="assets/css/bootstrap.css" rel="stylesheet" media="screen">
        <link href="assets/css/bootstrap-responsive.min.css" rel="stylesheet" media="screen">
		 <link href="assets/css/bootstrap.min.css" rel="stylesheet" media="screen">
    <style>
      body {
        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
      }
    </style>
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
 
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="../assets/js/html5shiv.js"></script>
    <![endif]-->
 
    <!-- Fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
                    <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
                                   <link rel="shortcut icon" href="assets/ico/favicon.png">
  </head>
 
  <body>
 <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="brand" href="http://andeznet.com">AndezNet</a>
          <div class="nav-collapse collapse">
            <ul class="nav">
              <li><a href="#">Home</a></li>
			  <li class="active"><a href="#">Biodata</a></li>
              <li><a href="#">Logout</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>
 
	<div class="container">
<?php
// memanggil file koneksi
include 'koneksi.php';
 
// instance objek db
$db = new database();
 
// koneksi ke MySQL via method
$db->connectMySQL();
 
// proses hapus data
if (isset($_GET['aksi'])) {
    if ($_GET['aksi'] == 'hapus') {
        // baca ID dari parameter ID Biodata yang akan dihapus
        $id = $_GET['id_b'];
 
        // proses hapus data biodata berdasarkan ID via method
        $db->hapusBiodata($id);
    } elseif ($_GET['aksi'] == 'tambah') {
        echo"<br>
<form method=POST action='?aksi=tambahBiodata'>
<table cellpadding='0' cellspacing='0' border='0' class='table table-striped table-bordered' >
<tr><td>Nama</td><td><input type=text name='nama'></td></tr>
<tr><td>Tempat lahir</td><td><input type=text name='tmpt_lahir'></td></tr>
<tr><td>Tanggal lahir</td><td><input type=text name='tgl_lahir' ></td></tr>
<tr><td>Alamat</td><td><textarea type=text name='alamat'></textarea></td></tr>
<tr><td>Telpon</td><td><input type=text name='telpon'></td></tr>
<tr><td></td><td><button type='submit' class='btn btn-primary'>SIMPAN</button></td></tr>
</table>
</form>
";
    } elseif ($_GET['aksi'] == 'tambahBiodata') {
        $nama = $_POST['nama'];
		$tmpt_lahir = $_POST['tmpt_lahir'];
		$tgl_lahir = $_POST['tgl_lahir'];
        $alamat = $_POST['alamat'];
        $telpon = $_POST['telpon'];
 
        $db->tambahBiodata($nama,$tmpt_lahir,$tgl_lahir, $alamat, $telpon);
    }
// proses edit data
    else if ($_GET['aksi'] == 'edit') {
        // baca ID Biodata yang akan di edit
        $id = $_GET['id_b'];
 
// menampilkan form edit Biodata pakai method bacaBiodata()
        ?>	
 
        <form class="form-horizontal" method="post" action="<?php $_SERVER['PHP_SELF'] ?>?aksi=update">
            <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" >
                <tr><td>Nama Lengkap</td><td>:</td>
                    <td><input type="text" name="nama" value="<?php echo $db->bacaDataBiodata('nama', $id); ?>"></td>
                </tr>
 
				<tr><td>Tempat lahir</td><td>:</td>
                    <td><input type="text" name="tmpt_lahir" value="<?php echo $db->bacaDataBiodata('tmpt_lahir', $id); ?>"></td>
                </tr>
 
				<tr><td>Tanggal lahir</td><td>:</td>
                    <td><input type="text" name="tgl_lahir" value="<?php echo $db->bacaDataBiodata('tgl_lahir', $id); ?>"></td>
                </tr>
 
                <tr><td>Alamat</td><td>:</td>
                    <td><textarea type="text" name="alamat" size="40"><?php echo $db->bacaDataBiodata('alamat', $id); ?></textarea></td>
                </tr>
 
                <tr><td>Telpon</td><td>:</td>
                    <td><input type="text" name="telpon" value="<?php echo $db->bacaDataBiodata('telpon', $id); ?>"></td>
                </tr>	
            </table>
            <input type="hidden" name="id" value="<?php echo $id; ?>">
            <td><button type='submit' class='btn btn-primary'>UPDATE</button></td>
        </form>
 
        <?php
    } else if ($_GET['aksi'] == 'update') {
        // proses update data biodata
        $id_b = $_POST['id'];
        $nama = $_POST['nama'];
		$tmpt_lahir = $_POST['tmpt_lahir'];
		$tgl_lahir = $_POST['tgl_lahir'];
        $alamat = $_POST['alamat'];
        $telpon = $_POST['telpon'];
 
        // update data via method
        $db->updateDataBiodata($id_b,$nama,$tmpt_lahir,$tgl_lahir,$alamat,$telpon);
    }
}
 
// buat array data biodata dari method tampilBiodata()
$arraybiodata = $db->tampilBiodata();
 
echo"</table> <br> <a href='?aksi=tambah'><button type='submit' class='btn btn-primary'>TAMBAH</button></a>";
echo "<table cellpadding='0' cellspacing='0' border='0' class='table table-striped table-bordered' >
      <tr><th>No</th>
           <th>Nama Biodata</th>
           <th>Tempat Lahir</th>
		    <th>Tanggal lahir</th>
			 <th>Alamat</th>
           <th>Telpon</th>
           <th>Aksi</th>
       </tr>";
$i = 1;
foreach ($arraybiodata as $data) {
    echo "<tr><td>" . $i . "</td> 
          	   <td>" . $data['nama'] . "</td>
			   <td>" . $data['tmpt_lahir'] . "</td>
			   <td>" . $data['tgl_lahir'] . "</td>
               <td>" . $data['alamat'] . "</td>
               <td>" . $data['telpon'] . "</td>
               <td><a class='btn btn-info btn-sm' href='" . $_SERVER['PHP_SELF'] . "?aksi=edit&id_b=" . $data['id'] . "'>Edit</a> 
                   <a class='btn btn-danger btn-sm' href='" . $_SERVER['PHP_SELF'] . "?aksi=hapus&id_b=" . $data['id'] . "'>Hapus</a></td>
            </tr>";
    $i++;
}
 
echo "</table>";
?>
</div>
 
	<div class="row-fluid">
			<div class="span12">
			  <div class="row-fluid">
				<div class="alert alert-info">
					<a name="contact"></a>
				  <h2>www.andeznet.com</h2>
				  <p class="text-info">Gudang Teknologi & Informasi</p>
				  <p>&copy; <a href="http://andeznet.com">www.andeznet.com</a>&nbsp<?php echo date("Y");?></p>
				</div><!--/span-->
			  </div><!--/row-->
			</div><!--/span-->
	</div><!--/row-->
 
 
    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap-transition.js"></script>
    <script src="assets/js/bootstrap-alert.js"></script>
    <script src="assets/js/bootstrap-modal.js"></script>
    <script src="assets/js/bootstrap-dropdown.js"></script>
    <script src="assets/js/bootstrap-scrollspy.js"></script>
    <script src="assets/js/bootstrap-tab.js"></script>
    <script src="assets/js/bootstrap-tooltip.js"></script>
    <script src="assets/js/bootstrap-popover.js"></script>
    <script src="assets/js/bootstrap-button.js"></script>
    <script src="assets/js/bootstrap-collapse.js"></script>
    <script src="assets/js/bootstrap-carousel.js"></script>
    <script src="assets/js/bootstrap-typeahead.js"></script>
 
	<script src="assets/js/bootstrap.min.js"></script>
 
  </body>
</html>

Jika sudah benar maka cek di browser anda dengan ketik http://localhost/crudoop

Membuat CRUD mengunakan konsep OOP di PHP dengan tampilan Bootstrap

Membuat CRUD mengunakan konsep OOP di PHP dengan tampilan Bootstrap

untuk download sorce code nya disini DOWNLOAD

Dari artikel diatas, bukan berarti saya mahir dalam OOP, saya juga masih dan dalam mempelajari konsep satu ini di PHP . Jadi mohon dikoreksi bila ada kata-kata / soucecode yang salah, mungkin teman-teman yang sudah pengalaman menggunakan konsep ini bisa menambahkan.

Happy Coding & Programing

 

 

19 comments
Ghijoon

Keep Posting gan,

ane lagi pake bootstrap dikombinasikan sama framework….
kalau menurut ane sih CRUDI gan, bukan CRUD…
Create Read Update Delete Index

hehehe walaupun cuman halaman Index tapi halaman Index juga memegang peranan penting

sekarang ane lagi kepentok paging di halaman Index pakai framework + bootstrap

rivaldi

om… bagaimana cara nya menambahakan view,search,dan pagination dari tutorial di atas ?

tutorialnya om..

nuhun…

portgastea

Ok terima kasih, next saya tampilin link demo nya juga

Luhur Budiutomo

Ini blog bagus amat yak… Bookmark

Ulil Albab Rabbani

Thanks banget gan buat tugas ane nih

bym

bro..
gw mau , pinjem isi otaknya dan sewa ilmunya..
gw hire kemana?: harus via projects.co.id ?

kuramaa

hi admin, bisa request tutorial untuk membuat halaman paging nya ?

toni

Kalau mau tambah struktur tabel di databasenya gimana?
mau tak kasih no.induk di bawah id. terus konfigurasi di index dan koneksi yang mana?
ane rubah kokk error terus.

Leave a Reply

Your email address will not be published.

Chat saya via Whatsapp