05.41

Upload Data denganPHP

Diposting oleh berbagi ilmu |

kali ini kita akan belajar bagaimana mengupload data menggunakan php. Pada tutorial kali ini, kita memberikan filtrasi/validasi tipe file yang bisa di upload dan ukuran file yang di upload. Secara lebih rinci, berikut aturannya.
1. Hanya mengizinkan file dengan type pdf atau zip
2. Data maksimum yang dapat di upload adalah 1 MB

Untuk source code upload tidak saya bahas lebih dalam, yang akan dibahas adalah bagaimana membuat penyaringan/validasi file yang di upload.

Fungsi untuk menyaring, tipe file yang di upload :

if($info['extension'] == 'pdf' || $info['extension'] == 'zip' ){
    echo'tipe file pdf atau zip';
    } else{
    exit('maaf tidak bisa upload karena file bukan pdf atau zip');
    }

Sedangkan fungsi untuk membatasi ukuran file

if(filesize($file)>1000000){
    echo 'ukuran file'.filesize($file).'<br />';
    exit('file terlalu besar ukuran file maksimum 1 MB');
    }
:
angka 1000000 menandakan batasan file yang di upload dalam byte.

Berikut ini kode program lengkapnya :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Upload File</title>
</head>
<body>
<form action="<?php $_SERVER['PHP_SELF'];?>"
method="post" enctype="multipart/form-data">
    File:<input type="file" name="fl" />
    <input type="submit" name="submit" value="Upload"/>
</form>
<?php
if (isset($_POST['submit'])
&& isset($_FILES['fl'])){
    //lokasi pada direktori upload
    $dir='./upload/';
    $file = $_FILES['fl']['tmp_name'];
    $name = $_FILES['fl']['name'];
    $info = pathinfo($name);
    //memastikan file tdk kosong
    if(!is_uploaded_file($file)){
        exit('No file selected..');
    }
    //menetapkan data maksimu file yang di upload
    if(filesize($file)>1000000){
    echo 'ukuran file'.filesize($file).'<br />';
    exit('file terlalu besar ukuran file maksimum 1 MB');
    }   
    //menetapkan tipe file
    if($info['extension'] == 'pdf' || $info['extension'] == 'zip' ){
    echo'tipe file pdf atau zip';
    } else{
    exit('maaf tidak bisa upload karena file bukan pdf atau zip');
    }
    if(!move_uploaded_file($file, $dir.$name)){
        echo 'Unable to upload file';
    }else {
        echo'FIle uploaded..';
    }
}
?>
</body>
</html>

Simpan kode program dalam filetype .php

Berikut tampilan programnya
image

04.28

Membuat Form LOgin

Diposting oleh berbagi ilmu |

Pada latihan berikut ini, kita akan membuat sebuah form login username dan password dengan validasi masukan awal disisi client menggunakan javascript dan validasi disisi server menggunakan php.

Aturannya adalah:

  1. Field username dan password tidak boleh kosong, username dan password harus berupa huruf bukan angka
  2. Jika field kosong dan langsung di-submit, kembalikan fokus kursor ke field pertama (id).
  3. Ada validasi sisi server (dari PHP) untuk memastikan bahwa nilai field adalah string.
  4. Jika nilai id dan password sesuai dengan pre-defined value di variabel, munculkan pesan selamat datang dan cetak nilai id. Sebaliknya, jika tidak sesuai, tampilkan pesan kegagalan.
Langkah awal, adalah membuat validasi sisi client dengan memanfaatkan regular expression pada java script. Aturannya adalah, masukan harus berupa huruf. Maka pola regexnya adalah

re = /^\D{3,}$/;
\D   berarti masukan harus huruf/bukan angka
{3,} berarti masukan minimal 3 karakter boleh lebih

Langkah selanjutnya adalah kita buat fungsi untuk memvalidasi formnya….

function checkUserName(v) {
    re = /^\D{3,}$/;
    return re.test(v);
}
function checkPass(v) {
    re = /^\D{3,}$/;
    return re.test(v);
}
function checkForm(f) {
    if (!checkUserName(f.username.value)) {
        alert("Please enter a valid username!");
        f.username.focus();
        return false;
    }
    if (!checkPass(f.password.value)) {
        alert("Please enter a valid PIN!");
        f.pin.focus();
        return false;
    }
    return true;
}
Setelah validasi disisi client beres… kita mengatur validasi disisi server dan juga mengatur username dan password yang benar…
Berikut sintaks phpnya …
<?php
if (isset($_POST['Login'])){
    $user = $_POST['username'];
    $pass = $_POST['password'];
    if($user == "azhar" && $pass == "ahmad") {
        echo"<h2>Login berhasil.... \n id anda = $user</h2>";
    } else {
        echo"<h2>Login gagal</h2>";
    }
}
?>

simpan sintaks php dengan nama login.php

Sekarang kita buat kode htmlnya…
Berikut ini kode html secara lengkap
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head><title>Validasi Login</title>
<link rel="stylesheet" href="login.css" type="text/css"/>
</head>
<body>
<script language="JavaScript" type="text/javascript">
function checkUserName(v) {
    re = /^\D{3,}$/;
    return re.test(v);
}
function checkPass(v) {
    re = /^\D{3,}$/;
    return re.test(v);
}
function checkForm(f) {
    if (!checkUserName(f.username.value)) {
        alert("Please enter a valid username!");
        f.username.focus();
        return false;
    }
    if (!checkPass(f.password.value)) {
        alert("Please enter a valid PIN!");
        f.pin.focus();
        return false;
    }
    return true;
}
</script>
<div id="form">
<h2 align="center">Login</h2>
<hr style="color:#3ebee9; border:double;" align="center" width="300"/>
<form action="login.php" method="POST" NAME="input" onSubmit="return checkForm(this)">
   <div id="Input">
   Username:<br />     <input type="text" name="username"/><br />
   Password:<br />     <input type="password" name="password"/><br />
   </div>
   <div id="btnLogin">
   <input type="submit" name="Login" value="Login">
    </div>
</form>
</div>
</body>
</html>

Simpan kode html tersebut dengan nama Login.html
Agar tampilan lebih indah, kita buat kode cssnya. Berikut ini kode cssnya…
#form{
margin-top:180px;
margin-left:450px;
font-family: arial;
font-size: 20px;
color:#3ebee9;
width:350px;
height : 250px;
background: #eef7ff;
border: 3px solid #9fd5f4;
}
#btnLogin{
margin-left:100px;
}
#Input{
margin-top: 30px ;
margin-left: 100px ;
margin-bottom: 10px;
font-family: calibri;
font-size: 15px;
color:#666666;
}

Simpan kode css tersebut dengan nama login.css
Ingat, semua kode tersebut harus disimpan dalam direktori yang sama.
Berikut ini tampilan form login

Diposting oleh berbagi ilmu |

Fungsi BuatTabel memiliki 2 argumen yang berisi variabel baris dan kolom.
perulangan pertama untuk membuat baris, perulangan kedua untuk membuat kolom . Perulangan for seperti ini disebut “nested for”.
Setelah kita membuat fungsi BuatTable, langkah selanjutanya adalah memanggil fungsi tersebut dan mengisikan argumen fungsi sesuai dengan keinginan kita. Misalkan kita ingin membuat tabel 5 baris dan enam kolom. Maka sintaks untuk pemanggilan fungsinya adalah : “BuatTabel(5,6);”Sintaks fungsi secara lengkap :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="
http://www.w3.org/1999/xhtml"xml:lang="en" lang="en">
<head>
<title>Generate Table</title>
</head>

<body>
<?php


function BuatTabel($baris, $kolom)
{
print("<h2 align=\"center\">Tabel $baris baris dan $kolom kolom</h2>");
print("<table align=\"center\" width = \"80%\" border=\"1\">\n");

for($b = 0; $b < $baris; $b++) {
print("<tr>\n");

for($k = 0; $k < $kolom; $k++) {
print("<td height=\"30\" width=\"10%\"></td>\n");
}
print("</tr>\n");
}
print("</table>\n");
}
BuatTabel(6,5); //memanggil fungsi BuatTabel

?>
</body>
</html>

Tampilan untuk sintaks di atas adalah sebagai berikut:

Subscribe