Kita lanjut lagi ke session 2 langsung tanpa basa basi ikutin langkah dibawah ini. Disini akan membuat Insert atau Tambah Data sesuai dengan judul kita di Atas. Ouh yah, disini kenapa Part 2 berarti Anda menemukan saya tidak dari Part 1, Anda wajib membaca Part 1 terlebih dahulu di sini.
Karna di link atas sudah saya aljabarkan semua, jadi di part selanjutnya tinggal meneruskan pembuatan CRUD menggunakan PHP. Jika sudah maka kita langsung lanjut.
Awal Code HTML yang didalamnya terdapat syntax php form yang mana dari sini akan langsung ngelink ke file berikutnya untuk mengolah inputan dalam syntax full PHP, jadi disini Ada 2 peraktek, membuat dalam bentuk HTML untuk tampilan inputan dan kedua membuat file untuk eksekusi inputan tersebut dalam bahasa PHP agar dapat di jalankan dan masuk ke dalam database.
A. File Add_Items.php Untuk Menampilkan Inputan Web
Langkah 1. Di Artikel sebelumnya menampilkan data dari database, maka Anda akan melihat sebuah button Add Item jika sudah Anda Klik seperti contoh dibawah ini, jika masih bingung kenapa tiba-tiba langsung mengarah kesini, saya ucapkan sekali lagi ini Part 2 sobat Anda bisa memulai dengan Part 1. Link ada diatas atau di bawah Artikel ini. Lihat contoh gambar dibawah ini.
Langkah 2. Jika Anda selesai klik maka anda akan menuju ke link kosong. Karna belum kita deklarasikan. Lihat code saya dibawah sudah saya siapkan copy paste ke dalam file add_items.php seluruh code.
- Membuat tampilan inputan HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>PT. Aspx Information</title>
<meta name="author" content="Angga Alp">
<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="index.php"><b>Home > </b></a><a href="#"><b>Form Add Item</b></a><br><br>
<b>Add Items</b>
<img src="images/garis.jpg" alt="line" />
</div>
<div class="box_content">
<form method="POST" action='add_items_action.php' enctype='multipart/form-data'>
<table class="table-body" align="center" border="7">
<td colspan="4">
<center>
<font color="#FF0000">
<b><?php if(isset($_REQUEST['err'])) echo $_REQUEST['err']; ?></B>
</font>
</center>
</td>
<tr>
<td width="140px">
<a style='font-size:14px'>
<b>Code Item</b>
</a>
</td>
<td>
<input type="text" name="code_item" placeholder="Kode Barang..."><br> 
<font color="#000099">*Kode barang harus diisi!</font>
</td>
<td><a style='font-size:14px'><b>Currency</b></a></td>
<td>
<select name="currency">
<option>RP</option>
<option>USD</option>
</select>
<br> <font color="#000099">*Currency!</font>
</td>
</tr>
<tr>
<td width="140px">
<a style='font-size:14px'><b>Product Name</b></a>
</td>
<td>
<input type="text" name="product_name" placeholder="Nama Barang..."><br> 
<font color="#000099">*Nama barang!</font>
</td>
<td width="180px">
<a style='font-size:14px'><b>Product Stock</b></a>
</td>
<td>
<input type="text" name='product_stock' placeholder="Jumlah Barang..."><br> 
<font color="#000099">*Jumlah barang Harus Berupa Angka!</font>
</td>
</tr>
<tr>
<td>
<a style='font-size:14px'><b>Product Price</b></a>
</td>
<td>
<input type="text" name="product_price" placeholder="Harga Barang..."><br> 
<font color="#000099">*Harga Barang Harus Berupa Angka!</font>
</td>
<td colspan="2"></td>
</tr>
<tr>
<td>
<a style='font-size:14px'><b>Product Details</b></a>
</td>
<td colspan="3">
<textarea name="product_details" rows="10" cols="80"></textarea>
</td>
</tr>
<tr>
<td colspan="4">
<center><a style='font-size:14px'><b>Product Images</b></a><br>
<input type=file name='fupload' size=40 class=btn>
<br>Tipe gambar harus JPG/JPEG dan ukuran lebar maks: 400 px</br>
</td>
</tr>
<tr>
<td colspan="4">
<font color="#ff0000">
<b>Catatan: Semua bidang yang ditandai dengan * wajib diisi</b>
</font>
</td>
</tr>
<tr>
<td colspan="4"><center>
<input type="submit" value="Simpan" class="btn btn-info">
<input type=button class="btn btn-warning" value=Batal onclick=self.history.back()>
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
- CSS untuk design yang Saya otak atik sendiri agar sesuai dengan gambar tampilan tanpa cacat fisik, lebih rapi dan enak dilihat. Letakan code dibawah ini ke dalam syntax <head> Letakan didalam sini </head> . Lalu save dengan menekan CTRL + S.
<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 sudah, coba di browser Anda lagi harusnya muncul beberapa field inputan untuk insert data kita ke database. Jika berhasil anda dapat melanjutkan ke tahap selanjutnya untuk membuat aksi atau penjalan dari hasil inputan ke database.
B. File Add_Items_action.php Untuk Mendeklarasikan Inputan di HTML kedalam syntax PHP Agar Ke Insert dalam Database MySQL
Langkah 3. Hampir sama cara seperti diatas kalian masukan code yang sudah saya aljabarkan di bawah, jangan lupa kalau bisa ketik dari awal yah, biar kalian lebih gampang nguasai Bahasa pemograman ini.
<?php
include("connection.php");
session_start();
$code_item = $_POST['code_item'];
$product_name = $_POST['product_name'];
$product_stock = $_POST['product_stock'];
$product_price = $_POST['product_price'];
$currency = $_POST['currency'];
$product_detail = $_POST['product_detail'];
$fupload = $_FILES['fupload']['name'];
move_uploaded_file($_FILES['fupload']['tmp_name'], "images/$fupload");
if($code_item == '')
{
header("location:add_items.php?err=Pesan Kesalahan : Kode Barang Harus Di Isi...!");
}else if($product_name == '')
{
header("location:add_items.php?err=Pesan Kesalahan : Nama Barang Harus Di Isi...!");
}else if($product_stock == '')
{
header("location:add_items.php?err=Pesan Kesalahan : Jumlah Barang Harus Di Isi...!");
}else if(!(is_numeric($_POST['product_stock'])))
{
header("location:add_items.php?err=Pesan Kesalahan : Jumlah Barang harus berupa angka!");
}else if($product_price == '')
{
header("location:add_items.php?err=Pesan Kesalahan : Harga Barang Harus Di Isi...!&id_all_items=$id_all_items");
}else if(!(is_numeric($_POST['product_price'])))
{
header("location:add_items.php?err=Pesan Kesalahan : Harga Barang harus berupa angka!");
}else if($currency == '')
{
header("location:add_items.php?err=Pesan Kesalahan : Currency Harus Di Isi...!");
}else if($fupload != '')
{
mysql_query("INSERT INTO all_items(Code_Item,Product_Name,Product_Stock,Product_Price,Currency,Product_Detail,Product_Image,Date_In)
VALUES('$code_item','$product_name',$product_stock,'$product_price','$currency','$product_detail','$fupload',NOW())");
header("location:index.php");
}else
{
$fupload = 'no-img.png';
mysql_query("INSERT INTO all_items(Code_Item,Product_Name,Product_Stock,Product_Price,Currency,Product_Detail,Product_Image,Date_In)
VALUES('$code_item','$product_name',$product_stock,'$product_price','$currency','$product_detail','$fupload',NOW())");
header("location:index.php");
}
?>
Jangan lupa setiap extention dalam PHP full harus tetap ada connection karna inilah yang menghubungkan anda dengan database mysql. Jika Anda telah selesai mengolah sesuai artikel diatas, maka langsung refresh browser Anda, lalu coba input sebuah data.
Setelah masukan inputan, tekan Simpan. Otomatis Anda telah berhasil menambahkan 1 item yang telah anda insert. Lihat contoh dibawah hasil dari inputan di atas.
Dengan kelarnya semua proses ini berarti udah 2 langkah yang Anda dapatkan yaitu artikel pertama tentang Select Data dan sekarang Insert Data telah sukses di kerjakan, sangat gampang kan, jika kalian masih belum berhasil bisa meninggalkan komentar dibawah saya otomatis akan langsung merespon semampu saya bisa. Jika sudah berhasil seperti diatas, anda langsung ke tahap selanjutnya baca artikel dibawah ini.
Jangan lupa juga untuk mampir ke Channel Youtube saya. "Angga Alp". Have Fun ^_^.
0 comments:
Post a Comment