Membuat Halaman Fitur Pemesanan Online

Halaman Pemesanan adalah sebuah fitur didalam sebuah Website yang berguna untuk melakukan pemesanan barang yang dijual di Website tersebut. Pada Artikel ini kita akan membahas cara pembuatan fitur pemesanan secara online.

1) Buat sebuah database MySQL bernama tokoonline

2) Kemudian buat tabel didalam database tokoonline bernama pemesan dengan rincian field sebagai berikut

Field	Type
nama	varchar(50)
email	varchar(70)
pensil	int(11)
buku	int(11)
penghapus	int(11)
rautan	int(11)
pulpen	int(11)
tas	int(11)
sepatu	int(11)
baju	int(11)
celana	int(11)
hargaPensil	int(11)
hargaBuku	int(11)
hargaPenghapus	int(11)
hargaRautan	int(11)
hargaPulpen	int(11)
hargaTas	int(11)
hargaSepatu	int(11)
hargaBaju	int(11)
hargaCelana	int(11)

3) Jika sudah, buka Text Editor yang biasa Anda gunakan untuk pemrograman

4) Buat file baru lalu salin kode dibawah ini

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Pemesanan Online</title>
<style type="text/css">

</style>
</head>

function isian(jenis, harga) {
  document.getElementById(jenis).value=harga;
 
 
}
</script>
<table width="100%" border="0" cellspacing="0">
<form action="konfirmpemesanan.php" method="post">
  <tr>
    <td height="54" colspan="6" bgcolor="#0099FF"><strong>FITUR PEMESANAN PERALATAN SEKOLAH </strong></td>
  </tr>
  <tr>
    <td width="161" rowspan="18"> </td>
    <td width="102"><strong>Nama Barang </strong></td>
    <td width="152"><strong>Jenis Barang </strong></td>
    <td width="90"><strong>Harga(RP)</strong></td>
    <td width="81"><strong>Jumlah </strong></td>
    <td width="124" rowspan="18"> </td>
  </tr>
  <tr>
    <td width="102">Pensil</td>
    <td width="152"><label>
      <select name="pensil" id="pensil" onchange="isian('hargaPensil',this.value);">
   <option value="0">-Pilih-</option>
      <option value="1000">Pensil 1B</option>
        <option value="2000">Pensil 2B</option>
        <option value="3000">Pensil 3B</option>
      </select>
    </label></td>
    <td width="90"><label><input name="hargaPensil" type="text" id="hargaPensil" value="0" size="11" maxlength="11" readonly="" />      </label></td>
    <td width="81">      <input name="pensil" type="text" id="pensil"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td width="102">Buku</td>
    <td width="152"><select name="buku" id="buku" onchange="isian('hargaBuku',this.value);">
      <option value="0">-Pilih-</option>
      <option value="2000">Buku Gambar</option>
      <option value="2500">Buku Tulis</option>
        </select></td>
    <td width="90">      <input name="hargaBuku" type="text" id="hargaBuku" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td width="81">      <input name="buku" type="text" id="buku"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td width="102">Penghapus</td>
    <td width="152"><select name="penghapus" id="penghapus" onchange="isian('hargaPenghapus',this.value);"><option value="0">-Pilih-</option>
      <option value="1000">Penghapus Besar</option>
      <option value="1500">Penghapus Kecil</option>
        </select></td>
    <td width="90">      <input name="hargaPenghapus" type="text" id="hargaPenghapus" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td width="81">      <input name="penghapus" type="text" id="penghapus"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td width="102">Rautan</td>
    <td width="152"><select name="rautan" id="rautan" onchange="isian('hargaRautan',this.value);"><option value="0">-Pilih-</option>
      <option value="500">Rautan Besar</option>
      <option value="2000">Rautan Kecil</option>
        </select></td>
    <td width="90">      <input name="hargaRautan" type="text" id="hargaRautan" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td width="81">      <input name="rautan" type="text" id="rautan"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td>Pulpen</td>
    <td><select name="pulpen" id="pulpen" onchange="isian('hargaPulpen',this.value);"><option value="0">-Pilih-</option>
      <option value="2100">Pulpen Tinta Hitam</option>
      <option value="2200">Pulpen Tinta Biru</option>
      <option value="2300">Pulpen Tinta Merah</option>
        </select></td>
    <td>      <input name="hargaPulpen" type="text" id="hargaPulpen" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td>      <input name="pulpen" type="text" id="pulpen"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td>Tas</td>
    <td><select name="tas" id="tas" onchange="isian('hargaTas',this.value);"><option value="0">-Pilih-</option>
      <option value="50000">Tas Hitam</option>
      <option value="52000">Tas Biru</option>
      <option value="54000">Tas Merah</option>
        </select></td>
    <td>      <input name="hargaTas" type="text" id="hargaTas" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td>      <input name="tas" type="text" id="tas"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td>Sepatu</td>
    <td><select name="sepatu" id="sepatu" onchange="isian('hargaSepatu',this.value);"><option value="0">-Pilih-</option>
      <option value="65000">Sepatu Olahraga</option>
      <option value="30000">Sepatu Sekolah</option>
        </select></td>
    <td>      <input name="hargaSepatu" type="text" id="hargaSepatu" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td>      <input name="sepatu" type="text" id="sepatu"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td>Baju Seragam</td>
    <td><select name="bajuseragam" id="bajuseragam" onchange="isian('hargaBaju',this.value);"><option value="0">-Pilih-</option>
      <option value="50000">SD</option>
      <option value="60000">SMP</option>
      <option value="70000">SMA</option>
        </select></td>
    <td>      <input name="hargaBaju" type="text" id="hargaBaju" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td>      <input name="baju" type="text" id="baju"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td>Celana Seragam </td>
    <td><select name="celanaseragam" id="celanaseragam" onchange="isian('hargaCelana',this.value);"><option value="0">-Pilih-</option>
      <option value="40000">SD</option>
      <option value="50000">SMP</option>
      <option value="60000">SMA</option>
        </select></td>
    <td>      <input name="hargaCelana" type="text" id="hargaCelana" value="0" size="11" maxlength="11" readonly="" />    </td>
    <td>      <input name="celana" type="text" id="celana"  onkeyup="valitAngka(this);" size="6"  maxlength="6" />    </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td colspan="4" bgcolor="#003399"><span class="style1">Data Diri Pembeli </span></td>
  </tr>
  <tr>
    <td bgcolor="#0033FF"> </td>
    <td bgcolor="#0033FF"> </td>
    <td bgcolor="#0033FF"> </td>
    <td bgcolor="#0033FF"> </td>
  </tr>
  <tr>
    <td bgcolor="#0033FF"><span class="style2">Nama</span></td>
    <td colspan="2" bgcolor="#0033FF"><label>
      <input name="nama" type="text" id="nama" size="40" maxlength="40" />
    </label></td>
    <td bgcolor="#0033FF"> </td>
  </tr>
  <tr>
    <td bgcolor="#0033FF"><span class="style2">E-Mail</span></td>
    <td colspan="2" bgcolor="#0033FF"><input name="email" type="text" id="email" size="40" maxlength="40" /></td>
    <td bgcolor="#0033FF"> </td>
  </tr>
  <tr>
    <td bgcolor="#0033FF"> </td>
    <td bgcolor="#0033FF"> </td>
    <td bgcolor="#0033FF"> </td>
    <td bgcolor="#0033FF"> </td>
  </tr>
  <tr>
    <td> </td>
    <td colspan="2"><label>
      <div align="center">
        <input type="submit" name="Submit" value="Lakukan Pemesanan" />
        </div>
    </label></td>
    <td> </td>
  </tr>
  <tr>
    <td width="102"> </td>
    <td width="152"> </td>
    <td width="90"> </td>
    <td width="81"> </td>
  </tr>
  </form>
</table>

5) Simpan file tersebut dengan nama pemesanan.php

6) Buat file baru lalu salin kode dibawah ini

<?php
$userSQL="root"; // Username MySQL Anda
$passSQL=""; // Password MySQL Anda

$dbSQL="tokoonline"; // Database MySQL Anda

$sql=mysql_connect("localhost",$userSQL,$passSQL);

$ps=0;
if (! $sql){
$ps++;
print("Terjadi kesalahan koneksi ke server SQL,");
}

$pilihDB=mysql_select_db($dbSQL,$sql);

if (! $pilihDB){
$ps++;
print("Terjadi kesalahan koneksi ke database $dbSQL pada server SQL,");
}

if($ps==0){
$nama=$_POST['nama'];

$email=$_POST['email'];

$pensil=$_POST['pensil'];

$buku=$_POST['buku'];

$penghapus=$_POST['penghapus'];

$rautan=$_POST['rautan'];

$pulpen=$_POST['pulpen'];

$tas=$_POST['tas'];

$sepatu=$_POST['sepatu'];

$baju=$_POST['baju'];

$celana=$_POST['celana'];

$hargaPensil=$_POST['hargaPensil'];

$hargaBuku=$_POST['hargaBuku'];

$hargaPenghapus=$_POST['hargaPenghapus'];

$hargaRautan=$_POST['hargaRautan'];

$hargaPulpen=$_POST['hargaPulpen'];

$hargaTas=$_POST['hargaTas'];

$hargaSepatu=$_POST['hargaSepatu'];

$hargaBaju=$_POST['hargaBaju'];

$hargaCelana=$_POST['hargaCelana'];

$masukData=mysql_query("INSERT INTO pemesan VALUES (

'$nama',

'$email',

'$pensil',

'$buku',

'$penghapus',

'$rautan',

'$pulpen',

'$tas',

'$sepatu',

'$baju',

'$celana',

'$hargaPensil',

'$hargaBuku',

'$hargaPenghapus',

'$hargaRautan',

'$hargaPulpen',

'$hargaTas',

'$hargaSepatu',

'$hargaBaju',

'$hargaCelana'

)");

if($masukData){

print("Data pemesanan Anda telah kami simpan, silahkan tunggu konfirmasi kami melalui email Anda");

}
}

7) Simpan file tersebut dengan nama konfirmpemesanan.php

8) Jalankan file pemesanan.php melalui browser Anda

Sekarang fitur halaman pemesanan online telah berhasil Anda buat

Cara pemakaian
===============================================
- Pilih barang yang ingin Anda beli

- Tentukan jenis barangnya

- Tentukan jumlah yang ingin dibeli

- Isikan nama dan email Anda pada bagian data diri

- Klik tombol Lanjutkan Pemesanan

- Data pemesanan Anda akan tersimpan di database tokoonline dalam tabel pemesan

==============================================

Jika Anda ingin membahas artikel ini dengan saya dan pengunjung lain silahkan isi kotak komentar yang berada dibawah artikel ini ^_^

Bahas Komputer

Membuat Halaman Fitur Pemesanan Online

Tidak ada komentar:

Jasa Pembuatan Website, Aplikasi Android dan Aplikasi iOS

Follow

Programmer Konsultan

Pembaca Setia

Arsip Blog

Popular Posts

Menu

Laporkan Penyalahgunaan

Cari Blog Ini

Label

Featured Posts

Featured Posts

Site Links

Follow

Featured Posts

About

Flickr Imags

Bahas Komputer

Membuat Halaman Fitur Pemesanan Online

You Might Also Like

Tidak ada komentar:

Jasa Pembuatan Website, Aplikasi Android dan Aplikasi iOS

Follow

Programmer Konsultan

Pembaca Setia

Arsip Blog

Popular Posts

Menu

Laporkan Penyalahgunaan

Cari Blog Ini

Label

Featured Posts

Featured Posts

Site Links

Follow

Featured Posts

About

Flickr Imags