Validasi & Konversi Bilangan di PHP ~ CarpeDiem

Kali ini saya akan berbagi cara membuat program PHP untuk membuat konversi bilangan yang disertai dengan validasi nama dan jenis kelamin, dalam program ini saya mencampur berbagai bahasa yaitu PHP, HTML, CSS, dan JavaScript.

Oke, dari pada bingung ayo disimak prosesnya :

Buka Netbeans, buat New PHP Web Page. Terserah mau diberi nama apa dan Anda letakkan dimana saja. Beri nama misalnya :KonversiBil&Validator.php
Jika sudah membuat file, langsung saja ketikkan code dibawah diatas tag <html>. Code ini adalah code php yang digunakan untik memvalidasi nama dan gender.

Selanjutnya ketikkan code berikut. Code ini fungsinya untuk desain tampilan web. Jangan lupa beri Judul diantara tag <tittle></tittle> , beri judul misalnya : Masuk.

<head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Masuk</title>
         <style type="text/css">
            body{
                background-image: url('gambar.jpg');
            }
            .a{
                text-shadow:4px 3px 3px red;
                font-family:Calligraph421 BT;
                font-weight:bold;
                color: #000000;
            }
            .b{
                text-shadow:3px 2px 2px red;
                font-family:Calligraph421 BT;
                font-weight:bold;
                color: #010101;
            }
            form input.highlight{
                background: #cc9595;
                borurder: solid 1px #CCCCCC;
                border-radius:10px;
                color: #000000;
                padding: 5px;
                box-shadow:2px 2px 3px  red;
                -webkit-transition: all 1s ease-in-out;
                -moz-transition: all 1s ease-in-out;
                -o-transition: all 1s ease-in-out;
            }
            form input.highlight:focus {
                border: solid 1px #D9AD00;
                background: graytext;
                border-radius:5px;
                color:  #fefffe;
                box-shadow:3px 3px 5px  #0000CC;
                -webkit-transition: all 1s ease-in-out;
                -moz-transition: all 1s ease-in-out;
                -o-transition: all 1s ease-in-out;
            }
        </style>
    </head>
    <body>
        <h1 class='a'>
<?php echo $cek ?></h1>
<br>
        <form action="KonversiBilangan.php" method="post" name="form1">
            <p>
<h3 class='b'>
Nama : <input class='highlight' placeholder="Nama" required="required" type="text" name="nama" size ="30" value="<?php echo $nama ?>"/></h3>
</p>
<p>
<h3 class='b'>
Jenis Kelamin : <br><input type="radio" name="gender" value="L"
                               <?php ($gender=="L")? print 'checked=""' : print ''; ?>/>
                Laki-Laki<br>
                <input type="radio" name="gender" value="P"
                       <?php ($gender=="P")? print 'checked=""' : print ''; ?>/>
                Perempuan
            </h3>
</p>
<input type="submit" name="submit" value="Masuk">
        </form>
</body>

Pada code di proses sebulumnya ada tulisan <form action="KonversiBilangan.php" method="post" name="form1">, itu artinya setelah data terisi benar proses akan berlanjut ke KonversiBilangan.php. Maka buat lagi web page dengan nama tersebut lalu tuliskan code berikut di atas <HTML>.

<?php if(isset($_POST['submit1'])){ $decimal=$_REQUEST['decimal']; if(isset($_POST['pilih'])){ $pilih=$_REQUEST['pilih']; } else{ $pilih=''; } } else{ $decimal=''; $pilih=''; } ?>
Kalau sudah ketikkan code css berikut di dalam head, gunanya untuk memperindah tampilan web.

<style type="text/css"> body{ background-image: url('gambar.jpg'); } a { width: 230px; border: 5px solid green; -webkit-transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; -o-transition: all 2s ease-in-out; font:18px Calligraph421 BT; font-weight: bold; color: #0000CC; margin: 20px; text-align: center; padding: 10px; border-radius: 10px; -moz-border-radius: 12px; -webkit-border-radius: 12px; background: #FFFF99; text-decoration: none; text-shadow: none; } a:hover{ background: #7488f4; } a:active{ color: #990000; } .b{ color: black; text-shadow:4px 4px 5px blue; font-family:Calligraph421 BT; font-weight:bold; } .bayangan{ text-shadow:4px 0px 7px Blue; font-family:Calligraph421 BT; font-weight:bold; color: #000; } .bayangan1{ text-shadow:4px 4px 7px green; box-shadow:0px 10px 30px red; font-family:Calligraph421 BT; font-weight:bold; color:black; } form input.highlight{ background: #91c470; borurder: solid 1px #CCCCCC; border-radius:5px; padding: 5px; color: #000000; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; } form input.highlight:focus { border: solid 1px #D9AD00; background: graytext; border-radius:5px; color: #fefffe; box-shadow:2px 2px 5px yellow; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; } </style>
Kemudian ketikkan code html & php berikut di bawah body, code ini berfungsi untuk menampilkan apa yang sudah kita buat di web page pertama tadi.

<h1 class="b"> Anda Memesuki Area Konversi Bilangan </h1> <table border="0" width="900px" heigh="900px" align ="center"> <tr> <td align ="center">  <?php if(isset ($_POST['submit'])){ $nama=$_REQUEST['nama']; if(isset($_POST['gender'])){ $gender=$_REQUEST['gender']; } else{ $gender=''; } } if(isset ($_POST['submit'])){ if($nama==''|| $gender==''){// tanda || : OR echo"<script> alert('Maaf data kurang lengkap, silahkan isi Nama dan Jenis Kelamin'); document.location.href='KonversiBil&Validator.php'; </script>";//menggunakan javascript } else{ //cek jenis kelamin //yang ini pakek petik dua if($gender=='L'){ echo"<br><h1 class='bayangan'> Selamat Datang Mas $nama </h1> "; } else{ echo"<br><h1 class='bayangan'> Selamat Datang Mbak $nama </h1> "; } } } ?>  </td> </tr> </table>
Setelahnya tulis code html berikut untuk menampilkan form dan pilihan konversi nantinya. Dan coba Anda lihat pada form ini, actionnya bertuliskan action="<?php echo $_SERVER['PHP_SELF']; ?>" yang artinya adalah file itu nantinya akan di proses di file PHP itu sendiri, yaitu file KonversiBilangan.php

<table border="1" width="900px" heigh="900px" align ="center" class='bayangan1'> <tr> <td align ="center"> <p> <form action="<?php echo $_SERVER['PHP_SELF']; ?> " method="POST" name="form1"> <h2> Tuliskan nilai bilangan Desimal anda : </h2> <input class='highlight' placeholder="desimal" required="required" type="text" name="decimal" size ="25" value="<?php echo $decimal ?>"/><br> <h2> Pilih salah satu Konversi : <br> <input type="radio" name="pilih" value="B" <?php ($pilih=="B")? print 'checked=""' : print ''; ?>/> Biner<br> <input type="radio" name="pilih" value="H" <?php ($pilih=="H")? print 'checked=""' : print ''; ?>/> Hexa<br> <input type="radio" name="pilih" value="O" <?php ($pilih=="O")? print 'checked=""' : print ''; ?>/> Oktal<br> </h2> <input type="submit" name="submit1" value="Konverikan"><br> </form>
Yang terakhir adalah code untuk konversinya sebagai berikut dan profram siap di run dengan tekan shift+f6.

 <?php if(isset($_POST['submit1'])){//isset : penekanan form $decimal=$_REQUEST['decimal']; if(isset($_POST['pilih'])){ $pilih=$_REQUEST['pilih']; } else{ $pilih=''; } } else{ $decimal=''; $pilih=''; } if(isset ($_POST['submit1'])){ if($decimal==''|| $pilih==''){ echo"<script>alert('Maaf data belum lengkap, Isi nilai Desimal dan pilih Konversi !!')</script>";//menggunakan javascript } else{ if($pilih=='B'){ //Konversi ke Biner if (isset($_POST['decimal'])) { $decimal = $_POST['decimal']; $original = $_POST['decimal']; $binary = ''; if (preg_match('/[^0-9]/',$decimal)) { die ("Maaf. Inputan salah..."); } else { while ($decimal > 0) { if ($decimal%2 == 0) { $binary .= 0; $decimal /= 2; } else { $binary .= 1; $decimal = ($decimal/2)-0.5; } } $result = strrev($binary); echo "<br><h2> Bilangan desimal : $original jika dijadikan Biner hasilnya adalah $result.</h2> "; } } else { } } else{ if($pilih=='H'){ //Konversi ke Hexa if(isset($_POST['decimal'])){ $des=$_POST['decimal']; $original=$_POST['decimal']; $hex=''; while ($des>0){ $hasil=$des%16; switch($hasil){ case 0 : $hex.="0"; break; case 1 : $hex.="1"; break; case 2 : $hex.="2"; break; case 3 : $hex.="3"; break; case 4 : $hex.="4"; break; case 5 : $hex.="5"; break; case 6 : $hex.="6"; break; case 7 : $hex.="7"; break; case 8 : $hex.="8"; break; case 9 : $hex.="9"; break; case 10: $hex.="A"; break; case 11: $hex.="B"; break; case 12: $hex.="C"; break; case 13: $hex.="D"; break; case 14: $hex.="E"; break; case 15: $hex.="F"; default:break; } if($des/16==0){ $sisa=($des%16); $des=$sisa; } else{ $sisa=($des/16); $des=$sisa%16; }} $result = strrev($hex); echo "<br><h2> Bilangan decimal : $original jika dijadikan Hexadecimal hasilnya adalah $result.</h2> "; } } else{ //Konversi ke Oktal if(isset($_POST['decimal'])){ $des=$_POST['decimal']; $original=$_POST['decimal']; $octal=''; while ($des>0){ $hasil=$des%8; switch($hasil){ case 0 : $octal.="0"; break; case 1 : $octal.="1"; break; case 2 : $octal.="2"; break; case 3 : $octal.="3"; break; case 4 : $octal.="4"; break; case 5 : $octal.="5"; break; case 6 : $octal.="6"; break; case 7 : $octal.="7"; default:break; } if($des/8>0){ $sisa=($des/8); $des=$sisa%8; } else{ $sisa=($des%8); $des=$sisa; }} $result = strrev($octal); echo "<br><h2> Bilangan decimal : $original jika dijadikan Oktal hasilnya adalah $result.</h2> "; } else{ } } } } } echo "<br><h2> <a href='KonversiBil&Validator.php'>Back</a></h2> <br><br>"; ?>  </td> </tr> </table>

Ini adalah screenshotnya

Tampilan Awal

Alert Bila nama dan jenis kelamin kosong

Tampilan Konversi

Inputan Desimal salah

Data belum lengkap

Hasil Konversi Bilangan

CarpeDiem

Selasa, 04 September 2012

Validasi & Konversi Bilangan di PHP

0 Comments:

Posting Komentar

Mengenai Saya

Blog Archive

BlogRoll

Categories

Pengikut

Traffic

Blog Archive

Labels

Blog Archive

Blogger templates

Blogger news

Blogroll

About

CarpeDiem

Selasa, 04 September 2012

Validasi & Konversi Bilangan di PHP

0 Comments:

Posting Komentar

Social Profiles

Mengenai Saya

Blog Archive

BlogRoll

Categories

Pengikut

Traffic

Blog Archive

Labels

Blog Archive

Blogger templates

Blogger news

Blogroll

About