Ukuran atau size maksimum gambar terkadang merupakan salah satu ketentuan pada saat proses upload gambar pada halaman website. Berdasarkan pengalaman pribadi, apabila kita ingin membatasi Size/Ukuran file gambar, maka kita harus melakukan pengaturan yang macam-macan sehingga membuat kita bingung.
Nah.., Pada kesempatan kali ini saya akan memberikan Inspirasi Source Code tentang Cara Mudah Membatasi Size/Ukuran maksimum Upload dan Edit File Gambar Pada Php Dan Mysql.
Lihat juga: Cara Mudah Review sebelum Upload,Edit,Hapus Gambar Pada Php Dan Mysql
Berikut langkah-langkahnya:
- Siapkan terlebih dahulu database untuk penyimpanan gambar
- Siapkan Folder penyimpanan gambar
- Download file dropify.min.css dan dropify.min.js
- Ketikan source code file penginputan gambar pada form seperti berikut:
<link href="css/dropify.min.css" type="text/css" rel="stylesheet" media="screen,projection">
<script type="text/javascript" src="js/dropify.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Basic
$('.dropify').dropify();
// Translated
$('.dropify-fr').dropify({
messages: {
default: 'Glissez-déposez un fichier ici ou cliquez',
replace: 'Glissez-déposez un fichier ou cliquez pour remplacer',
remove: 'Supprimer',
error: 'Désolé, le fichier trop volumineux'
}
});
// Used events
var drEvent = $('.dropify-event').dropify();
drEvent.on('dropify.beforeClear', function(event, element){
return confirm("Do you really want to delete \"" + element.filename + "\" ?");
});
drEvent.on('dropify.afterClear', function(event, element){
alert('File deleted');
});
});
</script>
<form action="" method="post">
<div class="form-group row">
<label class="col-sm-2 control-label">Upload Foto</label>
<div class="col-sm-6">
<input type="file" name="foto" id="input-file-max-fs" class="dropify" data-max-file-size="1M" required="" data-errormessage-value-missing="Upload Foto" />
</div>
</div>
</form>
<?php
include "include/koneksi.php";
if(isset($_POST['simpan'])){
$foto=$_FILES['foto']['name'];
if(strlen($foto)>0){
if(is_uploaded_file($_FILES['foto']['tmp_name'])){
$ext=strtolower(substr($_FILES['foto']['name'],-3));
if($ext=='gif')
$ext=".gif";
else
$ext=".png";
move_uploaded_file($_FILES['foto']['tmp_name'],"folder_foto/". basename(($_GET['id_gambar']).$ext));
}
$a=mysql_query("insert into tabel_foto values('', '".($getId[0]+1).$ext."')");
if($a){
echo '<div class="alert alert-success alert-st-one" role="alert"> <span class="adminpro-icon adminpro-checked-pro admin-check-pro"></span><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button><p class="message-mg-rt">Data Sukses di Simpan,..!</p></div>';
}
}
?>
**)Keterangan:
* Tulisan yang berwarna merah merupakan ukuran yang ditentukan saat proses upload file gambar.
- Untuk proses Edit gambar ketikan source code seperti berikut:
<?php
include "include/koneksi.php";
if(isset($_POST['edit'])){
$foto=$_FILES['foto']['name'];
if(strlen($foto)>0){
if(is_uploaded_file($_FILES['foto']['tmp_name'])){
$ext=strtolower(substr($_FILES['foto']['name'],-3));
if($ext=='gif')
$ext=".gif";
else
$ext=".png";
move_uploaded_file($_FILES['foto']['tmp_name'],"folder_foto/". basename(($_GET['id_gambar']).$ext));
}
$a=mysql_query("update tabel_foto set foto='".$_GET['id_gambar'].$ext."' WHERE id_gambar='$id_gambar'");
}
if($a){
echo '<div class="alert alert-success alert-st-one" role="alert"> <span class="adminpro-icon adminpro-checked-pro admin-check-pro"></span><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button><p class="message-mg-rt">Data Sukses di Update,..!</p></div>';
}
}
?>
<form action="" method="post">
<?php
$foto=$r['foto'];
if(empty($foto)){
?>
<div class="form-group row">
<label class="col-sm-2 control-label">Upload Foto</label>
<div class="col-sm-6">
<input type="file" name="foto" id="input-file-max-fs" class="dropify" data-max-file-size="1M" required="" data-errormessage-value-missing="Upload Foto" />
</div>
</div>
<?php
} else{
?>
<div class="form-group row">
<label class="col-sm-2 control-label">Foto Sebelumnya</label>
<div class="col-sm-2">
<img src="<?php echo "folder_foto/".$foto; ?>" alt="foto" width="80" height="90" style="border: 3px solid #DDD;" />
</div></div>
<div class="form-group row">
<label class="col-sm-2 control-label">Ganti Foto</label>
<div class="col-sm-6">
<input type="file" name="foto" id="input-file-max-fs" class="dropify" data-max-file-size="1M" />
</div>
</div>
<?php } ?>
</form>
<link href="css/dropify.min.css" type="text/css" rel="stylesheet" media="screen,projection">
<script type="text/javascript" src="js/dropify.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Basic
$('.dropify').dropify();
// Translated
$('.dropify-fr').dropify({
messages: {
default: 'Glissez-déposez un fichier ici ou cliquez',
replace: 'Glissez-déposez un fichier ou cliquez pour remplacer',
remove: 'Supprimer',
error: 'Désolé, le fichier trop volumineux'
}
});
// Used events
var drEvent = $('.dropify-event').dropify();
drEvent.on('dropify.beforeClear', function(event, element){
return confirm("Do you really want to delete \"" + element.filename + "\" ?");
});
drEvent.on('dropify.afterClear', function(event, element){
alert('File deleted');
});
});
</script>
**)Keterangan:
* Tulisan yang berwarna merah merupakan ukuran yang ditentukan saat proses pengeditan file gambar.
Lihat juga: Tips Input File Video Pada Php Dan Mysql - Inspirasi Source Code
Post a Comment