Javascript untuk Mengecek Ukuran File Sebelum Diupload dengan JQuery berfungsi untuk mengecek ukuran file yang sudah dipilih pengguna sebelum diupload. Sebenarnya hal ini sudah sangat umum dilakukan dengan script PHP, tetapi kurang efektif karena script PHP hanya mampu mengecek file yang sudah diupload.Artinya file yang mungkin sangat besar tersebut sudah terlanjur terupload di server baru dicek dan dinyatakan tidak boleh kemudian dihapus. Hal ini tentu saja sangat memboroskan waktu dan bandwith.
Maka penulis berinisiatif mencari script berikut ini, yaitu Javascript untuk mengecek ukuran file yang diplilih (di-browse) pengguna sebelum diupload atau di-submit. Sehingga kita bisa memperingatkan pengguna sebelum file tersebut mulai dikirim.
Buatlah halaman web, dalam hal ini penulis beri nama cek-file-size.html :
<!-- Using jquery -->
<html>
<body>
<script src="jquery.js"></script>
<form action="upload.php" enctype="multipart/form-data" method="post">
Upload image:
<input id="image-file" type="file" name="file" />
<input type="submit" value="Upload" onclick="if (eval(ukuran)>1.5) { alert('Ukuran File ' + ukuran + 'MB Melebihi Batas yaitu 1.5MB'); return false; } else { return true; }" />
<script type="text/javascript">
var ukuran = 0;
$('#image-file').bind('change', function() {
ukuran = this.files[0].size/1024/1024;
//alert('This file size is: ' + this.files[0].size/1024/1024 + "MB");
});
</script>
</form>
</body>
</html>
Ketika dijalankan, kemudian dipilih sebuah file dengan ukuran lebih dari batas yang telah ditentukan, dalam hal ini 1.5MB maka akan keluar peringatan seperti ini :
Sedangkan jika file yang dipilih kurang dari batas yang telah ditentukan maka proses Upload akan tetap berjalan.
Source Code selengkapnya dapat didownload disini. Jika kesulitan mendownload, ini caranya.
Semoga berguna ^_^
om, kalau fileuploadnya lebih dari satu bagaimana ya?
BalasHapussukses om, makasih m
BalasHapus