Aspx Information
Explain About What do You Know

Wednesday, 23 March 2016

Tutorial Membuat CRUD dengan PHP dan MySQL [Select Data] Tanpa Pesan Error PART 1

Hay guys, tidak bosen-bosen saya menyapa bagi pengunjung yang nyasar ke blog saya ini. Disini saya membagikan ilmu secara Free why? because bla bla bla.... hahaha. Yah, tidak ada alasan untuk saya memberika ilmu saya. Karna ilmu wajib kalian semua miliki. Mungkin di postingan lain sudah banyak yang membuat artikel tentang judul diatas, disini saya membuat bukan nyontek dari orang lain, saya telah lama menggeluti dibidang programmer, mungkin kesempatan saya baru sekarang untuk memposting hasil dari kerja keras saya selama ngoding.

Untuk para pemula ini bisa jadi panutan, karna saya tidak akan membahas secara rumit, agak sedikit joking but keep seriously. ^_^.

Untuk itu kita mulai dari awal banget, siapkan XAMPP Anda, Notepad++, beserta alokasi folder yang akan Anda bangun sebuah folder web Anda. Bagi kalian yang masih belum bisa mengakses XAMPP atau terdapat error, bahkan belum tahu dapatin XAMPP dan cara menginstallnya atau bahkan belum bisa koneksikan PHP anda atau bahkan koneksi antara php dengan mysql juga belum bisa. Huft.. saya sudah menyiapkannya dibawah ini, silahkan di simak dulu semuanya pasti sangat membantu.


Setelah selesai dengan pengetahuan kalian diatas mari kita mulai bahas 1 per 1. Ingat ketika Anda mulai tidak konsentrasi 1 hal yang mau saya sampaikan, coding tidak susah kalau kalian niat dari hati, dan menjadikan coding ini sebagai hobi kalian. Ok.

Langkah 1. Siapkan peralatan file yang akan kita gunakan. Lihat contoh dibawah:

Folder : css, images
File PHP : add_items, add_items_action, connection, delete_items, edit_items, edit_items_action, index.
File DB : db_aspxinformation

Bagi kalian yang masih belum tahu cara letak folder PHP kalian dimana, ok ok, kalian tekan keyboard Windows + M (Mengotomatiskan minimize keseluruhan yang terbuka di dekstop) , klik START -> Computer atau langsung WINDOWS + E .

Lalu klik pada Local Disk C -> XAMPP -> htdocs -> Buat folder disini dengan nama bebas apa yang Anda mau, contoh folder saya "aspxinformation". 

Lalu buat lah file di langkah 1 di dalam folder yang Anda barusan buat disini folder saya bernama aspxinformation jadi semua file saya letakan di dalam folder ini.

Langkah 2. Siapkan database Anda, disini saya telah menyiapkan database untuk CRUD yang akan Kita buat. Kalian kalau masih belum paham cara membuat database bisa membaca artikel saya dibawah ini, setelah selesai membaca dan mencoba silahkan kembali lagi kesini, dan ikuti langkah selanjutnya, saya juga akan menampilkan contoh database dibawah.






Jika kalian telah menyiapkan database seperti contoh diatas save lalu letakan database ke folder php di HTDOCS , nama boleh bebas tapi saran saya ikutin sesuai dengan yang saya buat jika kalian berhasil sampai selesai maka bebas untuk kedepan mau coba dengan imajinasi kalian sendiri.

Langkah 3. Buka notepad++ atau aplikasi lainnya seperti dreamweaver, etc. Disini saya menggunakan Notepad++. Sebelum copy syntax untuk index.php pastikan Anda telah koneksikan PHP dengan Database MySQL Anda, karna jika belum maka percuma anda ikutin pembelajaran ini akan terjadi error. Jika Anda masih belum tahu cara connection lihat artikel dibawah.

- Cara Menghubungkan PHP dengan MySQL (Connection Syntax PHP)

atau

<?php
       $host = "localhost";
       $pass = "";
       $user = "root";
       $db   = "db_aspxinformation";

       $connect = mysql_connect($host,$user,$pass);
       if(!$connect)
      {
             echo "Gagal Melakukan Koneksi Karena : ".mysql_error();
      }
      else
     {
             mysql_select_db($db);
      }
?>

Copy kan syntax ini lalu paste ke dalam file connection.php . Jika sudah maka anda sudah bernafas legah, karna dengan adanya koneksi ini anda bisa dengan mudah menggunakannya untuk menggunakan database yang mau Anda buat.

Langkah 4. Anda buka file index.php disini kita akan memulai membuat Codingan untuk Select database yang udah kita Buat. Copy Paste code saya dibawah ini ke dalam file index. saya membaginya 1 persatu biar anda bisa sekalian belajar.


  • Copy syntax dibawah ini yaitu syntax htm yang berupa tabel dan PHP untuk menampilkan data dari database. Jangan lupa paling awal masukan connection yang kita buat diatas tadi, karna jika tidak ada ini error akan terjadi, berfungsi menghubungkan php anda dengan mysql.


<?php include("connection.php"); ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>PT. Aspx Information</title>
<meta name="author" content="Dennis Ji">
<meta name="description" content="Pembelian item filter">
<meta name="keyword" content="Items , PT Aspx Information">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="content" class="span10">
<div style="padding-bottom: 20px;">
<img src="images/icon_home.png" width="30" height="20" />
<a href="#"><b>Home</b></a><br><br>
<b>All Items</b>
<img src="images/garis.jpg" alt="line" />
</div>
<div style="text-align: center; padding-bottom: 10px;"><a href="add_items.php" ><button class="btn btn-lg">Add Item</button></a></div>
<div class="box_content">
<table class="table-body" align="center" border="7">
<thead>
<tr>
<th><center>Images</th>
<th>Code Items</th>
<th>Product Name</th>
<th>Product Details</th>
<th><center>Qty</center></th>
<th>Product Price</th>
<th><center>Currency</center></th>
<th>Date In</th>
<th><center>Action</center></th>
</tr>
</thead> 
<tbody>
<?php
function IDR($nilai, $pecahan = 0) { return number_format($nilai, $pecahan, ',', '.');  }
$sqltr= mysql_query("select * from  all_items Order By id_all_items DESC");
while($rowe=mysql_fetch_array($sqltr))
{
?>
                <tr>
                <td width="60px"><center>
<a style="background:url(images/<?php  echo $rowe['productImage'] ?>)" title="Sample Image 1" href="images/<?php  echo $rowe['productImage'] ?>">
<img src="images/<?php  echo $rowe['productImage'] ?>" width="50px" height="20px">
</a>
</td>
                    <td width="100px"><?php echo $rowe['Code_Item'] ?></td>
<td width="120px"><?php echo $rowe['Product_Name'] ?></td>
<td width="140px"><?php echo $rowe['Product_Detail'] ?></td>
<td width="20px"><?php echo $rowe['Product_Stock'] ?></td>
<td width="80px"><font color="#FF0000"><?php echo IDR($rowe['Product_Price']); ?></font></td>
<td width="50px"><center><?php echo $rowe['Currency'] ?></center></td>
<td width="100px"><?php echo $rowe['Date_In'] ?></td>
<td width="80"><center>
<a href="edit_items.php?id_all_items=<?php echo $rowe['id_all_items'] ?>" >
<button><img src="images/document_edit.png" width="20" height="20"></button>
</a>
<a href="delete_items.php?id_all_items=<?php echo $rowe['id_all_items'] ?>" >
<button><img src="images/Delete_Icon.png" width="20" height="20px" /></button>
</a>
</center></td>
                 </tr>    
            <?php } ?>   
            </tbody>
        </table>
</div>
</div>
<footer>
<center><p><span>Copyright&nbsp &copy; 2016 <font colour="#000000"><b>Aspx Information Angga Alp</b></font></span></p></center>
</footer>
<script>
function delete_records(pointer){
$(pointer).parents("div.records").remove();
}
</script>
</body>
</html>

  • Lalu Anda copy kan lagi untuk sintak CSS nya di bawah ini kedalam <head> isi didalam sini </head> pada sintak yang anda copy diatas.

        <style>
.content{
margin: auto;
width: 993px;
padding-bottom: 50px;
}
.box_content {
                        text-align: center;
                        border: solid 1px #cccccc;
                        padding: 8px;
                }
.btn{
display: inline-block;
margin-bottom: 0;
font-weight: normal;
text-align: center;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
background-image: none;
border: 1px solid transparent;
background: #B4B4B4;
white-space: nowrap;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-o-border-radius: 2px;
-ms-border-radius: 2px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
text-decoration: none;
color: #fff;
}
a.btn, a.btn:hover{
text-decoration: none;
color: #333;
}
.btn:hover{
background: #AAA;
}
.btn.lg{
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
}
.table-body{
border: 1px solid;
}
a:link{ text-decoration: none; }
a:hover{ text-decoration: none; }
a:active{ text-decoration: none; }
</style>

Jika selesai Anda coba test di localhost anda, ketikan saja localhost/aspxinformation/ atau localhost:8080/aspxinformation/ maka Anda akan melihat tampilan seperti dibawah ini.


Jika berhasil, berarti Anda mengikuti cara diatas dengan benar dan kenapa kosong, yah jelas karna database yang Anda buat belum Anda isi, ilias masih kosong, Anda boleh mencoba nya untuk menambahkan data secara manual dulu. Seperti contoh dibawah ini. Jika kalian mengalami Error atau masih pusing Anda bisa mengulang materi ini dari awal atau menanyakan saya langsung dengan meninggalkan komen dibawah artikel ini.


Artikel ini masih berlanjut, silahkan klik artikel dibawah untuk melanjutkan pembelajaran mengenai CRUD yang mau Anda buat. Disini cukup sekian untuk menampilkan data atau select data dari database, karna dengan awal kita sudah menampilkan data langkah berikut nya akan menjadi lebih mudah lagi. Selanjutnya Kita akan membahas Insert Data atau menambahkan data dengan php dalam database.

- CRUD dengan PHP dan MySQL [Create/Insert Data] Tanpa Pesan Error PART 2
- CRUD dengan PHP dan MySQL [Edit Data] Tanpa Pesan Error PART 3
- CRUD dengan PHP dan MySQL [Delete Data] Tanpa Pesan Error PART 4

Jangan lupa juga untuk mampir ke Channel Youtube saya. "Angga Alp". Have Fun ^_^.



0 comments:

Post a Comment