neezasty.files.wordpress.com€¦ · Web viewINTEGRASI FRONTEND DAN BACKEND. Pada modul pembuatan...

INTEGRASI FRONTEND DAN BACKEND

Pada modul pembuatan frontend, kita telah membuat desain awal dari website ecommerce. Namun, bagian isi dari website tersebut belum dinamis karena tidak mengambil konten dari database. Modul ini akan membahas bagaimana suatu website frontend diintegrasikan dengan bagian backend.

header.php

1. Buka file header.php yang terdapat di dalam folder inc/.2. Tambahkan fungsi include() file config.php dan fungsi session_start(). Letakkan

kode sebelum tag HTML.

<?php include('admin/inc/config.php'); ?>

<?php session_start(); ?>

3. Ubah isi di dalam dropdown Produk menjadi data dari tabel kategori produk. Kode di bawah ini akan menampilkan seluruh kategori produk dari tabel kategori.

<nav class="dropdown"> <ul> <li> <a href="product.php">Produk <img src="img/down-arrow.gif" alt="Produk"></a> <ul> <?php $query = mysql_query("SELECT * FROM kategori"); while($data = mysql_fetch_array($query)) { echo "<li><a href='product.php?kategori=$data[id_kategori]'>$data[kategori]</a></li>"; } ?> </ul> </li> </ul></nav>

4. Pada bagian dropdown Sign In, tambahkan kode untuk mengecek apakah member telah login. Jika sudah login, akan menampilkan menu Profil Saya dan Sign Out. Jika belum login, menampilkan Sign In dan Sign Up.

<div id="user-menu"> <nav id="signin" class="dropdown"> <ul> <?php if(isset($_SESSION['email']) AND isset($_SESSION['password'])){

FILE INCLUDE

?> <li> <a href="account.php"><img src="img/user-icon.gif" alt="Sign In" /> <?php echo "Profil Saya"; ?> <img src="img/down-arrow.gif" alt="Produk"></a> <ul> <li><a href="account.php">Profil Saya</a></li> <li><a href="sign_out.php">Sign Out</a></li> </ul> </li> <?php } else { ?> <li> <a href="sign_in.php"><img src="img/user-icon.gif" alt="Sign In" /> Sign In <img src="img/down-arrow.gif" alt="Sign In" /></a> <ul> <li><a href="sign_in.php">Sign In</a></li> <li><a href="sign_up.php">Sign Up</a></li> </ul> </li> <?php } ?> </ul> </nav></div>

5. Langkah terakhir adalah menampilkan jumlah barang yang ada di keranjang belanja. Fungsi empty() digunakan untuk mengecek apakah variabel dalam keadaan kosong atau tidak.

<div id="view-cart"> <a href="cart.php"><img src="img/blue-cart.gif" alt="View Cart"> ( <?php if(empty($_SESSION['cart'])) { echo "0"; } else { echo array_sum($_SESSION['cart']); } ?> )</a></div>

6. Lihat hasilnya di web browser.

kategori.php

1. Buat file baru dengan nama kategori.php dan simpan dalam folder inc/. File ini digunakan untuk menampilkan semua kategori di sidebar halaman.

2. Tuliskan kode berikut ini:

<aside id="categories-menu"> <h3>Kategori</h3> <ul> <?php $query = mysql_query("SELECT * FROM kategori"); while($data = mysql_fetch_array($query)) { echo "<li><a href='product.php?kategori=$data[id_kategori]'>$data[kategori]</a></li>"; } ?> </ul></aside>

1. Buka file index.php kemudian ubah konten yang terdapat pada <div id=”products”> menjadi kode di bawah ini. Kode ini akan menampilkan empat produk yang terdapat pada tabel produk.

<div id="products">

<?php $query = mysql_query("SELECT * FROM produk LIMIT 0,4");

HALAMAN INDEX

if(mysql_num_rows($query) > 0) { while($data = mysql_fetch_array($query)) { if($data['stok'] == 1) { $stok = "<span class='instock'>Stok Tersedia</span>"; } else { $stok = "<span class='outofstock'>Stok Habis</span>"; } echo " <div class='product'> <a href='product_detail.php?id=$data[id_produk]'><img src='admin/uploads/product/$data[gambar]' alt='$data[judul]' class='feature'></a>

<h3><a href='product_detail.php?id=$data[id_produk]'>$data[judul]</a></h3>

<p>$data[deskripsi]</p>

<h5>Ketersediaan: $stok</h5>

<p> <a href='cart.php?id=$data[id_produk]' class='cart-btn'> <span class='price'>Rp. ".number_format($data['harga'], 0, ',', '.')."</span> <img src='img/white-cart.gif' alt='Add to Cart'>BELI </a> </p> </div> "; } } else { echo "<h3>Tidak ada data</h3>"; } ?></div>


blog.php

1. Buka file blog.php kemudian ubah isi pada <aside id="categories-menu"> dengan kode berikut.

<aside id="categories-menu"> <h3>Blog Terbaru</h3> <ul> <?php $query = mysql_query("SELECT * FROM blog ORDER BY id_blog DESC LIMIT 0,5"); while($data = mysql_fetch_array($query)) { echo "<li><a href='blog_detail.php?id=$data[id_blog]'>$data[judul]</a></li>"; } ?> </ul></aside>

2. Kode di atas akan menampilkan lima judul blog terbaru.

HALAMAN BLOG

3. Selanjutnya adalah mengubah isi pada <div id=”listings”>. Pada bagian ini kita akan menampilkan daftar blog dari tabel blog.

<div id="listings"> <?php $start = 0; $limit = 6;

if(isset($_GET['page'])) { $page=$_GET['page']; $start=($page-1)*$limit; } $query = mysql_query("SELECT * FROM blog ORDER BY id_blog DESC LIMIT $start, $limit"); while($data = mysql_fetch_array($query)) { echo " <div class='product'> <a href='blog_detail.php?id=$data[id_blog]'><img src='admin/uploads/blog/$data[gambar]' alt='$data[judul]' class='feature'></a>

<h3><a href='blog_detail.php?id=$data[id_blog]'>$data[judul]</a></h3>


<p> <a href='blog_detail.php?id=$data[id_blog]' class='blog-btn'>Selengkapnya</a> </p>

</div> "; } ?></div>

4. Langkah terakhir adalah memberikan pagination ke halaman blog.php.

<section id="pagination"> <p> <?php $query = mysql_query("SELECT * FROM blog"); $rows=mysql_num_rows($query); $total=ceil($rows/$limit); echo "Halaman: "; for($i=1;$i<=$total;$i++) { if($i == $page OR (!isset($_GET['page']) AND $i == 1)) { echo "<span class='current'>$i</span>"; } else { echo "<a href='blog.php?page=$i'>$i</a>"; } if($i != $total) { echo " / "; } } ?> </p></section>


blog_detail.php

1. Perhatikan pada kode <a href='blog_detail.php?id=$data[id_blog]'> yang terdapat pada halaman blog.php. Link a href tersebut mengarah ke halaman blog_detail.php dengan menambahkan parameter id berupa id_blog.

2. Buka file blog_detail.php kemudian ubah isi di dalam <section id="main-content" class="clearfix">

<section id="main-content" class="clearfix"> <div class="container"> <hr> <?php $query = mysql_query("SELECT * FROM blog WHERE id_blog = $_GET[id]"); while($data = mysql_fetch_array($query)) { echo " <div id='blog-details'> <h1>$data[judul]</h1> <p class='blog-date'>Tanggal: <span>".date("d F Y", strtotime($data['tanggal']))."</span></p> <div id='blog-image'> <img src='admin/uploads/blog/$data[gambar]' alt='$data[judul]'> </div> <p>$data[isi]</p> </div> "; } ?> </div></section>


4. Kemudian tambahkan kode berikut sebelum tag <section id="main-content" class="clearfix">. Kode berikut ini akan menampilkan fitur komentar Facebook.

<div id="fb-root"></div><script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=302332663189047&version=v2.0"; fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>

5. Selanjutnya tambahkan kode berikut di bawah tag penutup php ?>.

<div class="fb-comments" data-href="http://localhost/karisma_ecommerce/blog_detail.php?id=<?php echo $_GET['id']; ?>" data-width="100%" data-numposts="5" data-colorscheme="light"></div>


product.php

1. Buka file product.php kemudian tambahkan operasi kondisi sebelum tag <section id="promo-alt"> untuk mengecek apakah terdapat variabel $_GET[‘kategori’]. Jika terdapat variabel $_GET[‘kategori’] maka tidak akan menampilkan <section id="promo-alt">.

<?php if(!isset($_GET['kategori'])) {?> <section id="promo-alt"> <div class="container"> <div id="promo1">

HALAMAN PRODUK

<h1>The brand new MacBook Pro</h1> <p>With a special price, <span class="bold">today only!</span></p> <a href="product.php" class="secondary-btn">READ MORE</a> <img src="img/macbook.png" alt="MacBook Pro"> </div> <div id="promo2"> <h2>The iPhone 5 is now<br>available in our store!</h2> <a href="product.php">Read more <img src="img/right-arrow.gif" alt="Read more"></a> <img src="img/iphone.png" alt="iPhone"> </div> <div id="promo3"> <img src="img/thunderbolt.png" alt="Thunderbolt"> <h2>The 27"<br>Thunderbolt Display.<br>Simply Stunning.</h2> <a href="product.php">Read more <img src="img/right-arrow.gif" alt="Read more" /></a> </div> </div> </section><?php }?>

2. Hapus seluruh isi pada tag <aside id="categories-menu"> dan ganti dengan tag berikut. File kategori.php berisi daftar kategori produk yang ada di tabel kategori.

<?php include ('inc/kategori.php'); ?>

Sebelum Sesudah<aside id="categories-menu"> <h3>Kategori</h3> <ul> <li><a href="product.php">Laptop</a></li> <li><a href="product.php">Desktop PC</a></li> <li><a href="product.php">Smartphone</a></li> <li><a href="product.php">Tablet</a></li> </ul></aside>


3. Modifikasi isi di dalam tag <div id="listings"> menjadi:

<div id="listings"> <?php $start = 0; $limit = 6;

if(isset($_GET['page'])) { $page=$_GET['page']; $start=($page-1)*$limit; } if(!isset($_GET['kategori'])) { $query = mysql_query("SELECT * FROM produk LIMIT $start, $limit"); } else { $query = mysql_query("SELECT * FROM produk WHERE id_kategori = '$_GET[kategori]' LIMIT $start, $limit"); } while($data = mysql_fetch_array($query)) { if($data['stok'] == 1) { $stok = "<span class='instock'>Stok Tersedia</span>"; } else { $stok = "<span class='outofstock'>Stok Habis</span>"; } echo " <div class='product'> <a href='product_detail.php?id=$data[id_produk]'><img src='admin/uploads/product/$data[gambar]' alt='$data[judul]' class='feature'></a>




<p> <a href='cart.php?id=$data[id_produk]' class='cart-btn'> <span class='price'>Rp. ".number_format($data['harga'], 0, ',', '.')."</span> <img src='img/white-cart.gif' alt='Add to Cart'>BELI </a> </p> </div> "; } ?></div>

Konsep Pagination:

$start = 0; // nilai awal dari pagination$limit = 6; // jumlah record yang akan ditampilkan// mengecek apakah terdapat variabel $_GET[‘page’]if(isset($_GET['page'])) { $page=$_GET['page']; $start=($page-1)*$limit;}

// query yang dijalankan$query = mysql_query("SELECT * FROM produk LIMIT $start, $limit");

Hasil:

4. Langkah terakhir tambahkan kode untuk pagination.

<section id="pagination"> <p> <?php if(!isset($_GET['kategori'] )) { $query = mysql_query("SELECT * FROM produk"); } else { $query = mysql_query("SELECT * FROM produk WHERE id_kategori = '$_GET[kategori]'"); } $rows=mysql_num_rows($query); $total=ceil($rows/$limit); echo "Halaman: "; for($i=1;$i<=$total;$i++) { if($i == $page OR (!isset($_GET['page']) AND $i == 1)) { echo "<span class='current'>$i</span>"; } else { if(!isset($_GET['kategori'])) { echo "<a href='product.php?page=$i'>$i</a>"; } else { echo "<a href='product.php?kategori=$_GET[kategori]&page=$i'>$i</a>"; } }

if($i != $total) { echo " / "; } } ?> </p></section>


product_detail.php

1. Buka file product_detail.php kemudian modifikasi kode yang terdapat dalam tag <section id="main-content" class="clearfix">.

<section id="main-content" class="clearfix"> <div class="container"> <hr> <?php $query = mysql_query("SELECT * FROM produk WHERE id_produk = $_GET[id]"); while($data = mysql_fetch_array($query)) { if($data['stok'] == 1) { $stok = "<span class='instock'>Stok Tersedia</span>"; } else { $stok = "<span class='outofstock'>Stok Habis</span>"; } echo " <div id='product-image'> <img src='admin/uploads/product/$data[gambar]' alt='$data[judul]'> </div> <div id='product-details'> <h1>$data[judul]</h1>

<p class='code'>Kode Produk: <span>$data[id_produk]</span></p> <p>$data[isi]</p>

<hr>

<form action='cart.php' method='get'> <input type='hidden' name='id' value='$data[id_produk]'> <label for='qty'>Qty:</label> <input type='text' id='qty' name='qty' value='1' maxlength='2'> <button type='submit' class='secondary-cart-btn'> <img src='img/white-cart.gif' alt='Add to Cart' /> BELI SEKARANG </button> </form> </div> <div id='product-info'> <p class='price'>Rp. ".number_format($data['harga'], 0, ',', '.')."</p> <h5>Ketersediaan: $stok</h5> </div> "; } ?> </div></section>


HALAMAN PENCARIAN

1. Buka halaman search.php kemudian modifikasi bagian tag <section id=”main-content”>.

<section id="main-content"> <div class="container"> <hr> <h2>Hasil pencarian untuk <span>"<?php echo $_GET['search']; ?>"</span></h2> <hr> <?php include ('inc/kategori.php'); ?>

<div id="listings"> <?php $query = mysql_query("SELECT * FROM produk WHERE judul LIKE '%$_GET[search]%'"); if(mysql_num_rows($query) > 0) { while($data = mysql_fetch_array($query)) { if($data['stok'] == 1) { $stok = "<span class='instock'>Stok Tersedia</span>"; } else { $stok = "<span class='outofstock'>Stok Habis</span>"; } echo " <div class='product'> <a href='product_detail.php?id=$data[id_produk]'><img src='admin/uploads/product/$data[gambar]' alt='$data[judul]' class='feature'></a>




<p> <a href='cart.php?id=$data[id_produk]' class='cart-btn'> <span class='price'>Rp. ".number_format($data['harga'], 0, ',', '.')."</span> <img src='img/white-cart.gif' alt='Add to Cart'>BELI </a> </p> </div> "; } } else { echo "<h3>Data tidak ditemukan."; } ?>

</div> </div></section>


1. Buka halaman sign_up.php kemudian tambahkan kode untuk mengecek apakah member telah login. Jika telah login, maka akan me-redirect ke halaman account.php.

<?php if(isset($_SESSION['email']) AND isset($_SESSION['password'])){ header('location:account.php'); }?>

2. Ubah atribut action pada form menjadi seperti berikut ini.

<form action="sign_up.php?act=sign_up" method="post">

3. Setelah itu ketikkan kode yang digunakan untuk memasukkan data member.

<?php if(isset($_GET['act']) AND $_GET['act']=='sign_up') { if($_POST['password'] == $_POST['password_confirmation']){ $tambah = mysql_query("INSERT INTO member (nama_depan, nama_belakang, alamat, email, password, telepon) VALUES ('$_POST[firstname]', '$_POST[lastname]', '$_POST[address]', '$_POST[email]', '$_POST[password]', '$_POST[telephone]')");

HALAMAN SIGN-UP

if($tambah) { echo "<h4>Data berhasil disimpan.</h4>"; } else { echo "<h4>Data gagal disimpan.</h4>"; } } else { echo "<h4>Password harus sama!</h4>"; } }?>


1. Buka halaman sign_in.php kemudian tambahkan kode untuk mengecek apakah member telah login. Jika telah login, maka akan me-redirect ke halaman account.php.

<?php if(isset($_SESSION['email']) AND isset($_SESSION['password'])){ header('location:account.php'); }?>

2. Ubah atribut action pada form menjadi seperti berikut ini.

<form action="sign_in.php?act=sign_in" method="post">

3. Setelah itu ketikkan kode yang digunakan untuk login member.

<?php if(isset($_GET['act']) AND $_GET['act']=='sign_in') { $query = mysql_query("SELECT * FROM member WHERE email = '$_POST[email]' AND password = '$_POST[password]'");

HALAMAN SIGN-IN

if(mysql_num_rows($query) == 1) { session_start(); $_SESSION['email'] = $_POST['email']; $_SESSION['password'] = $_POST['password'];

header('location:account.php'); } else { echo "<h1>Gagal login!</h1>"; } }?>


account.php

1. Buka file account.php dan tambahkan operasi kondisi untuk mengecek apakah member telah login.

<?php if(!isset($_SESSION['email']) AND !isset($_SESSION['password'])){ header('location:sign_in.php'); }?>

2. Ubah seluruh isi yang terdapat pada tag <aside id=”categories-menu”>.


3. Modifikasi bagian tag <div id=”personal-details”>.

<div id="personal-details"> <?php // mengecek apakah tombol SIMPAN telah di klik if(isset($_POST['id'])){ $_SESSION['email'] = $_POST['email'];

HALAMAN ACCOUNT

$query = mysql_query("UPDATE member SET nama_depan = '$_POST[firstname]', nama_belakang = '$_POST[lastname]', alamat = '$_POST[alamat]', email = '$_POST[email]', telepon = '$_POST[telepon]' WHERE id_member = '$_POST[id]'"); } ?> <h1>Data Pribadi</h1>

<?php $query = mysql_query("SELECT * FROM member WHERE email = '$_SESSION[email]' AND password = '$_SESSION[password]'"); $data = mysql_fetch_array($query); ?> <form action="account.php" method="post"> <p> <label for="firstname"> <span class="required-field">*</span> NAMA DEPAN: </label> <input type="text" id="firstname" name="firstname" value="<?php echo $data['nama_depan']; ?>" required> </p> <p> <label for="lastname"> <span class="required-field">*</span> NAMA BELAKANG: </label> <input type="text" id="lastname" name="lastname" value="<?php echo $data['nama_belakang']; ?>" required> </p> <p> <label for="address"> <span class="required-field">*</span> ALAMAT: </label> <input type="text" id="address" name="alamat" value="<?php echo $data['alamat']; ?>" required> </p> <p> <label for="email"> <span class="required-field">*</span> EMAIL: </label> <input type="email" id="email" name="email" value="<?php echo $data['email']; ?>" required> </p> <p> <label for="telephone"> <span class="required-field">*</span> TELEPON: </label> <input type="text" id="telephone" name="telepon" value="<?php echo $data['telepon']; ?>" required> </p>

<p><span class="required-field">*</span> wajib diisi.</p>

<hr> <input type="hidden" name="id" value="<?php echo $data['id_member']; ?>">

<input type="submit" value="SIMPAN" class="secondary-cart-btn"> </form></div>


sign_out.php

1. Buat file baru dengan nama sign_out.php.2. Tambahkan kode berikut ini untuk menghapus session member.

<?php session_start(); session_destroy(); header('location:index.php');

?>

order_history.php

HALAMAN PEMESANAN

1. Buka file order_history.php dan tambahkan operasi kondisi untuk mengecek apakah member telah login.


2. Ubah isi dalam tag <section id=”main-content”>.

<section id="main-content"> <div class="container"> <hr> <h2>Pembelian Produk</h2>

<hr>


<div id="order-history"> <h1>Daftar Pesanan</h1>

<table border="1"> <tr> <th>#</th> <th>ID Pemesanan</th> <th>Tanggal</th> <th>Total</th> <th>Status</th> </tr> <?php // mendapatkan id_member $query = mysql_query("SELECT * FROM member WHERE email = '$_SESSION[email]' AND password = '$_SESSION[password]'"); $data = mysql_fetch_array($query); $id_member = $data['id_member']; //data pesanan $i=0; $order = mysql_query("SELECT * FROM pesanan WHERE id_member = '$id_member' ORDER BY id_pesanan DESC"); while($hasil = mysql_fetch_array($order)){ $i++; if($hasil['status'] == 1) { $status = "<td class='finalized'>Finalized</td>"; } elseif($hasil['status'] == 2) { $status = "<td class='pending'>Pending</td>"; } else { $status = "<td class='aborted'>Aborted</td>"; } echo " <tr> <td>$i</td>

<td><a href='order_detail.php?id=$hasil[id_pesanan]'>$hasil[id_pesanan]</a></td> <td>".date("d F Y", strtotime($hasil['tanggal']))."</td> <td>Rp. ".number_format($hasil['harga'], 0, ',', '.')."</td> $status </tr> "; } ?> </table> </div> </div></section>


order_detail.php

1. Buka file order_detail.php dan tambahkan operasi kondisi untuk mengecek apakah member telah login.


2. Ubah isi dalam tag <section id=”main-content”>.

<section id="main-content"> <div class="container"> <hr> <h2>Pembelian Produk</h2>

<hr>


<div id="order-details"> <?php // mendapatkan id_member $query = mysql_query("SELECT * FROM member WHERE email = '$_SESSION[email]' AND password = '$_SESSION[password]'"); $data = mysql_fetch_array($query); //data pesanan $order = mysql_query("SELECT * FROM pesanan WHERE id_pesanan = '$_GET[id]'"); $hasil = mysql_fetch_array($order); ?> <h1>Detail Pemesanan</h1> <h2>Order #<?php echo $hasil['id_pesanan']; ?></h2> <p>Tanggal: <?php echo date("d/m/Y", strtotime($hasil['tanggal'])); ?></p> <h2>Informasi Pembeli</h2> <p> Nama: <?php echo $data['nama_depan']." ".$data['nama_belakang']; ?><br> Telepon: <?php echo $data['telepon']; ?><br> Email: <?php echo $data['email']; ?> </p> <h2>Produk</h2> <table border="1"> <tr> <th>#</th> <th>Nama Produk</th> <th>Harga</th> <th>Jumlah</th> <th>Subtotal</th> </tr> <?php $i = 0; $subtotal = 0; $total = 0; $detail = mysql_query("SELECT * FROM pesanan_detail WHERE id_pesanan = '$_GET[id]'"); while($list = mysql_fetch_array($detail)){ $i++; $produk = mysql_query("SELECT * FROM produk WHERE id_produk = '$list[id_produk]'"); $hasil_produk = mysql_fetch_array($produk); $subtotal = $hasil_produk['harga'] * $list['jumlah']; echo " <tr> <td>$i</td> <td>$hasil_produk[judul]</td> <td>Rp. ".number_format($hasil_produk['harga'], 0, ',', '.')."</td> <td>$list[jumlah]</td>

<td>Rp. ".number_format($subtotal, 0, ',', '.')."</td> </tr> "; $total = $total + $subtotal; } ?> <tr class="total"> <td colspan="5"> Subtotal: <?php echo "Rp. ".number_format($total, 0, ',', '.'); ?> <br /> <span>TOTAL: <?php echo "Rp. ".number_format($total, 0, ',', '.'); ?></span> </td> </tr> </table>

<a href="#" class="secondary-cart-btn" onclick="window.print();">CETAK</a> </div> </div></section>

cart.php

1. Buka halaman cart.php dan modifikasi bagian <div id=”shopping-cart”>.

<div id="shopping-cart"> <h2>Keranjang Belanja</h2>

<form action="cart.php?act=checkout" method="post"> <table border="1"> <tr> <th>#</th> <th>Nama Produk</th> <th>Harga</th> <th>Jumlah</th> <th>Subtotal</th> </tr> <?php if(!empty($_SESSION['cart'])) { $produk = join(',', array_keys($_SESSION['cart'])); $i = 0; $total = 0; $query = mysql_query("SELECT * FROM produk WHERE id_produk IN ($produk)"); while($data = mysql_fetch_array($query)) { $i++;

HALAMAN CART

$jumlah_barang = $_SESSION['cart'][$data['id_produk']]; $subtotal = $jumlah_barang * $data['harga']; echo " <tr> <td>$i</td> <td><a href='product_detail.php?id=$data[id_produk]'><img src='admin/uploads/product/$data[gambar]' alt='$data[judul]'>$data[judul]</a></td> <td>Rp. ".number_format($data['harga'], 0, ',', '.')."</td> <td>$jumlah_barang</td> <td> Rp. ".number_format($subtotal, 0, ',', '.')." <a href='cart.php?act=hapus&produk=$data[id_produk]'> <img src='img/remove.gif' class='remove' alt='Hapus'> </a> </td> </tr> "; $total = $total + $subtotal; } echo "<tr class='total'> <td colspan='5'> <span>Total: Rp. ".number_format($total, 2, ',', '.')."</span> <br> <a href='product.php' class='tertiary-btn'>KEMBALI BELANJA</a> <a href='cart.php?act=checkout' class='secondary-cart-btn'>LAKUKAN PEMBAYARAN</a> </td> </tr> "; } else { echo "<tr class='total'> <td colspan='5'> <span>Keranjang belanja Anda kosong</span> </td> </tr> "; } ?> </table> </form></div>

2. Tambahkan pengecekan apakah variabel $_GET[‘id’] telah di-set.

<?php // penambahan keranjang belanja if(isset($_GET['id'])) {

$id = intval($_GET['id']); if(isset($_GET['qty'])) { $qty = intval($_GET['qty']); $_SESSION['cart'][$id] = $qty; } else { if(!isset($_SESSION['cart'][$id])) { $_SESSION['cart'][$id] = 1; } else { $_SESSION['cart'][$id] = $_SESSION['cart'][$id] += 1; } } }?>

3. Jika kondisi di atas bernilai benar, variabel $_GET[‘id’] akan disimpan dalam variabel $id. Fungsi intval() digunakan untuk mengkonversi value ke tipe data integer. Note: $_GET[‘id’] merupakan ID Produk.

4. Setelah itu terdapat pengecekan apakah terdapat variabel $_GET[‘qty’] telah di-set. Jika benar, maka akan membuat variabel session berupa array indeks ke $id dengan value $qty.

Ilustrasi:

Jika kita membeli produk id_produk = 2 dengan jumlah 5 dan id_produk = 8 dengan jumlah 1 maka hasilnya:

id_produk atau $_GET[‘id’]

$_GET[‘qty’]

Sekarang tambahkan var_dump($_SESSION['cart']); untuk mengecek variabel session cart. Hasilnya:

5. Jika opsi sebelumnya bernilai false, maka akan mengecek apakah variabel $_SESSION[‘cart’][$id] kosong atau tidak. Jika kosong, maka akan membuat variabel $_SESSION[‘cart’][$id] dengan nilai 1. Jika tidak, maka akan menambah value dari variabel $_SESSION[‘cart’][$id] sebanyak 1.

6. Tambahkan elseif untuk aksi ketika tombol hapus ditekan. Kode di bawah ini akan menghapus variabel $_SESSION[‘cart’] dengan indeks sesuai variabel $_GET[‘produk’] menggunakan fungsi unset().

elseif(isset($_GET['act']) AND $_GET['act']=='hapus') { unset($_SESSION['cart'][$_GET['produk']]);}

7. Langkah terakhir adalah memberikan operasi kondisi jika tombol LAKUKAN PEMBAYARAN ditekan.

elseif(isset($_GET['act']) AND $_GET['act']=='checkout') { if(isset($_SESSION['email']) AND isset($_SESSION['password'])){ // mendapatkan id_member

$query_member = mysql_query("SELECT * FROM member WHERE email = '$_SESSION[email]' AND password = '$_SESSION[password]'"); $data_member = mysql_fetch_array($query_member); // mendapatkan data produk $produk = join(',', array_keys($_SESSION['cart'])); $harga = 0; $query_harga = mysql_query("SELECT id_produk, harga FROM produk WHERE id_produk IN ($produk)"); while($data_harga = mysql_fetch_array($query_harga)){ $harga = $harga + ($data_harga['harga'] * $_SESSION['cart'][$data_harga['id_produk']]); } $pesanan = mysql_query("INSERT INTO pesanan (id_member, tanggal, harga, status) VALUES ('$data_member[id_member]', NOW(), '$harga', 2)"); $id_pesanan = mysql_query("SELECT LAST_INSERT_ID() INTO @pesanan"); $detail_pesanan = mysql_query("SELECT * FROM produk WHERE id_produk IN ($produk)"); while($data_pesanan = mysql_fetch_array($detail_pesanan)) { $jumlah_barang = $_SESSION['cart'][$data_pesanan['id_produk']]; mysql_query("INSERT INTO pesanan_detail (id_pesanan, id_produk, jumlah) VALUES (@pesanan, '$data_pesanan[id_produk]', '$jumlah_barang')"); } if($pesanan){ unset($_SESSION['cart']); echo "<h3 style='color: #f00;'>Data pesanan telah masuk. Silakan lakukan konfirmasi pembayaran.</h3>"; } else { echo "<h3 style='color: #f00;'>Data pesanan gagal disimpan."; } } else { header('location:sign_in.php'); }}

8. Pada kode di atas, terdapat pengecekan apakah member sudah login atau belum. Jika sudah, maka program akan:

a. Mendapatkan ID member berdasarkan email dan password login.

$query_member = mysql_query("SELECT * FROM member WHERE email = '$_SESSION[email]' AND password = '$_SESSION[password]'");$data_member = mysql_fetch_array($query_member);

b. Mendapatkan ID produk dari session cart. Fungsi join() adalah fungsi yang digunakan untuk mengumpulkan komponen-komponen array menjadi suatu string.

Di bawah ini, array yang dikumpulkan merupakan key-nya saja dengan separator berupa tanda koma (,).

$produk = join(',', array_keys($_SESSION['cart']));

c. Menghitung total harga pembelian. Total harga didapatkan dari menghitung harga satuan produk dikalikan dengan jumlah barang yang akan dibeli. Pada query mysql di bawah terdapat perintah IN yang digunakan untuk memilih semua record yang ada di dalam variabel $produk.

$harga = 0;$query_harga = mysql_query("SELECT id_produk, harga FROM produk WHERE id_produk IN ($produk)");while($data_harga = mysql_fetch_array($query_harga)){ $harga = $harga + ($data_harga['harga'] * $_SESSION['cart'][$data_harga['id_produk']]);}

d. Memasukkan data pesanan berupa: id_member, tanggal, harga, dan status.

$pesanan = mysql_query("INSERT INTO pesanan (id_member, tanggal, harga, status) VALUES ('$data_member[id_member]', NOW(), '$harga', 2)");

e. Mendapatkan id yang terakhir dimasukkan dari tabel pesanan dan disimpan dalam variabel @pesanan.

$id_pesanan = mysql_query("SELECT LAST_INSERT_ID() INTO @pesanan");

f. Memasukkan data detail pesanan berupa: @pesanan, ID produk, dan jumlah barang.

$detail_pesanan = mysql_query("SELECT * FROM produk WHERE id_produk IN ($produk)");while($data_pesanan = mysql_fetch_array($detail_pesanan)) { $jumlah_barang = $_SESSION['cart'][$data_pesanan['id_produk']]; mysql_query("INSERT INTO pesanan_detail (id_pesanan, id_produk, jumlah) VALUES (@pesanan, '$data_pesanan[id_produk]', '$jumlah_barang')");}

g. Pengecekan jika data pesanan berhasil disimpan.

if($pesanan){ unset($_SESSION['cart']); echo "<h3 style='color: #f00;'>Data pesanan telah masuk. Silakan lakukan konfirmasi pembayaran.</h3>";} else { echo "<h3 style='color: #f00;'>Data pesanan gagal disimpan.";}


Ketika tombol LAKUKAN PEMBAYARAN ditekan:

Pada halaman admin:

neezasty.files.wordpress.com€¦ · Web viewINTEGRASI FRONTEND DAN BACKEND. Pada modul pembuatan...

Documents

Transcript of neezasty.files.wordpress.com€¦ · Web viewINTEGRASI FRONTEND DAN BACKEND. Pada modul pembuatan...