Cara Membatasi Ukuran Upload dengan Javascript

Pada kesempatan ini saya akan berbagi cara mengenai membatasi ukuran upload dengan javascript. Terkadang kita membutuhkan cara bagaimana bisa membatasi file yang akan di upload melalui php dengan bantuan form upload dari html. Cara lain juga dapat kita jumpai dengan menggunakan validasi pada bahasa php pada saat submit.

Namun dengan javascript semua akan jadi cepat dan mudah. Anda cukup memilih file kemudian langsung ada pemberitahuan bahwa file telah melebihi batas ukuran yang ditetapkan. Cara kerja source code ini adalah, pertama tama user memilih file yang diupload, kemudian source code javascript memeriksa apakah file tersebut melebihi batas ukuran yang ditetapkan. Dan pada akhirnya source code akan memberikan pesan atau alert “File melebihi batas ukuran“. Nah. Kira kira begitu cara kerjanya.

Berikut adalah source code membatasi ukuran upload dengan javascript :
action form sengaja saya buat “#”. nanti teman teman bisa sesuaikan sendiri.

<html>
<head>
<title>Cara Membatasi Ukuran Upload dengan Javascript</title>
</head>
<body>
<form action="#" enctype="multipart/form-data" method="POST">

<input type="file" name="userfile" id="file" />
<input type="submit" value="upload" />
<script type="text/javascript">
var uploadField = document.getElementById("file");
uploadField.onchange = function() {
    if(this.files[0].size > 800000){ // ini untuk ukuran 800KB, 1000000 untuk 1 MB.
       alert("Maaf. File Terlalu Besar ! Maksimal Upload 800 KB");
       this.value = "";
    };
};
</script> 
</form>
</body>
</html>

Nah. Mudah bukan, dengan javascript ini validasi dapat kita lakukan dengan lebih mudah, dengan begini bagi yang sedang belajar membuat sistem informasi tentu akan lebih menambah wawasannya dalam membuat sistem informasi. Javascript ini adalah jalan untuk memudahkan para web developer untuk mengembangkan project-project mereka. Terimakasih 🙂

Baca artikel lainnya (klik gambar) :

Jangan lupa tinggalkan komen ya

Related posts

Leave a Comment