Bismillah…
Kali ini ada trick memanfaatkan plugin js ke module API Prima SIMRS … berikut contoh video GIF singkatnya:
*Catatan: Divideo saya menggunakan Plugin Facebox.js untuk popup seperti itu.
Ikuti ajah tutorialnya disini ya:
Inget, sampai faham betul yah ikutin… kalo kali ini gw cuman share trick ajah, berupa script potongan. Kalo ikutin tutorial di Point 1 pasti akan menemukan script js berikut ini:
Dropzone.autoDiscover = false;
var foto_upload= new Dropzone(".dropzone",{
url: "upload.php",
maxFilesize: 2,
method:"post",
acceptedFiles:"image/*",
paramName:"userfile",
dictInvalidFileType:"Type file ini tidak dizinkan",
addRemoveLinks:true,
});
//Event ketika Memulai mengupload
foto_upload.on("sending",function(a,b,c){
a.token=Math.random();
c.append("token_foto",a.token); //Menmpersiapkan token untuk masing masing foto
});
//Event ketika foto dihapus
foto_upload.on("removedfile",function(a){
var token=a.token;
$.ajax({
type:"post",
data:{token:token},
url: "remove.php",
cache:false,
dataType: 'json',
success: function(){
console.log("Foto terhapus");
},
error: function(){
console.log("Error");
}
});
});
Ternyata script tersebut berhasil tapi yang gw butuhin tuh habis upload terus refresh halaman foto sebelumnya muncul lagi, nah ternyata ada di Point 3 script tersebut, berikut scriptnya:
// source: https://github.com/edomaru/ci_dropzone/
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone(".dropzone", {
url: "upload.php",
acceptedFiles: "image/*",
maxFilesize: 2,
paramName:"userfile",
dictInvalidFileType:"Type file ini tidak dizinkan",
addRemoveLinks: true,
// previewTemplate: document.querySelector('#preview-template').innerHTML,
clickable: true,
sending: function(a,b,c) {
a.token = Math.random();
c.append("token_foto",a.token); //Menmpersiapkan token untuk masing masing foto
},
removedfile: function(file) {
var token= file.token;
$.ajax({
type: "post",
url: "remove.php"+token,
data:{token:token},
dataType: 'json',
cache:false,
});
// remove the thumbnail
var previewElement;
return (previewElement = file.previewElement) != null ? (previewElement.parentNode.removeChild(file.previewElement)) : (void 0);
},
init: function() {
var me = this;
$.get("<?php echo site_url();?>api/website/dokter/list_foto/", function(data) { //alert(data);
// if any files already in server show all here
if (data.length > 0) {
$.each(data, function(key, value) {
var mockFile = value;
me.emit("addedfile", mockFile);
me.emit("thumbnail", mockFile, "<?php echo ROOTURL; ?>/foto/real/" + value.name);
me.emit("complete", mockFile);
var a = document.createElement('a');
a.setAttribute('href',"<?php echo ROOTURL; ?>/foto/real/" + value.name);
a.innerHTML = "Download<b>";
value.previewTemplate.appendChild(a);
});
}
});
}
});
Nah udah deh, foto yang pernah ke upload keliatan juga akhirnya.
Done.
Have a Nice Day!
