Pertemuan 2

Selasa,19

Tutorial Pembuatan Kalkulator Sederhana :




Kode :

<!DOCTYPE html>
<html>
<head><title>Perhitungan</title></head>
<body>
<form method="post">
<table>
<tr>
<td colspan="3" align="center">
<h1>Perhitungan Matematika Sederhana</h1>
</td>
</tr>
<tr>
<td align="center">Angka 1</td>
<td align="center">operator</td>
<td align="center">Angka 2</td>
</tr>
<tr>
<td align="center"><input type="number" name="angka1" required/></td>
<td align="center">
<select name="pilihan">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
</td>
<td align="center"><input type="number" name="angka2" required/></td>
</tr>
<tr>
<?php
$pilih = $_POST["pilihan"];
switch ($pilih){
case "+":
$hasil = $_POST["angka1"] + $_POST["angka2"];
break;
case "-":
$hasil = $_POST["angka1"] - $_POST["angka2"];
break;
case "*":
$hasil = $_POST["angka1"] * $_POST["angka2"];
break;
case "/":
$hasil = $_POST["angka1"] / $_POST["angka2"];
break;
}
?>
<td colspan="3" align="center"><input type="submit" name="hitung" value="Hitung"></td>
</tr>
<tr>
<td colspan="3" align="center"><input type="text" placeholder="Hasil Penghitungan" name="hasil" disabled value="<?php echo $hasil;?>"></td>
</tr>
</table>
</form>
</body>
</html>

Langkah Pembuatan PHP :

   Hal-hal yang dibutuhkan dalam pembuatan PHP adalah xampp, notepad++, browser.
1. Instal xampp, notepad++ dan brower (chrome disarankan)
2. Pada xampp control centang Svc untuk Apache kemudian start.
3. Buka notepate++ kemudian tuliskan atau copas kode diatas dalam notepad++
4. Simpan dalam C:\xampp\htdocs\"nama folder"\ (tanpa petik)
5. Untuk menjalankan, buka browser pada alamat ketik (localhost/"nama folder"/"Namafile.php") tanpa petik contoh sama seperti SS diatas.

Penjelasan Kode
1. Untuk textfield Angka yang pertma dan ke dua
    <input type="number" name="angka1" required/>
    <input type="number" name="angka2" required/>
terdapat required yang berfungsi sebagai pengingat yang apabila textfield tersebut belum disi (kosong) .
2. Untuk Operator menggunakan combobox yang berisi + ; - ; * ; /
      <select name="pilihan">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
     </select>

3. Tombol Hitung
    <input type="submit" name="hitung" value="Hitung">
untuk membuat sebuah buton cukup mengganti type data dengan "submit".

4. TextField Hasil
    <input type="text" placeholder="Hasil Penghitungan" name="hasil" disabled value="<?php echo $hasil;?>">
placeholde berfungsi memberi penaam awal yang otomatis akan hilang bila field tersebut terisi.
disable berfungsi sebagai agar fieldtersebut tidak bisa diedit (read only)
pada value terdapat fungsi "<?php echo $hasil;?>" yang artinya dia akam memanggil fungsi php dari variabel "$hasil", kode yang di jalankan
    <?php
$pilih = $_POST["pilihan"];
switch ($pilih){
case "+":
$hasil = $_POST["angka1"] + $_POST["angka2"];
break;
case "-":
$hasil = $_POST["angka1"] - $_POST["angka2"];
break;
case "*":
$hasil = $_POST["angka1"] * $_POST["angka2"];
break;
case "/":
$hasil = $_POST["angka1"] / $_POST["angka2"];
break;
}
   ?>
pada dasarnya fungsi ini berjalan saat perintah ke 3 (buton hitung diklik)
penjelasan kode :
$pilih = $_POST["pilihan"];  artinya variabel "pilih" mengambil nilai dari "pilihan" (name pada combobox)
$_POST berfungsi mengambil nilai.
untuk fungsi menggunakan switch case :
switch ($pilih) pada variabel "pilih" dia mengambil atau bernilai sama dengan value dari option combobox
setiap setelah penulisan 1 case d akhiri dengan "break;" dengan tujuan agar case yang lain tidak dieksekusi.

Sebenarnya untuk penulisan fungsi bisa juga menggunakan if ... else
contoh :
   <?php
$pilih = $_POST["pilih"];
if($pilih=="+"){
   $hasil = $_POST["angka1"] + $_POST["angka2"];
}else if ($pilih == "-"){
$hasil = $_POST["angka1"] - $_POST["angka2"];
}else if ($pilih == "*"){
$hasil = $_POST["angka1"] * $_POST["angka2"];
}else if ($pilih == "/"){
$hasil = $_POST["angka1"] / $_POST["angka2"];
}
   ?>




Tidak ada komentar

Posting Komentar

bayu breeze. Diberdayakan oleh Blogger.