I'm using Dropzone.js with Spring boot.
Everything works fine except, when I upload image it goes on the bottom of gallery.
How can I make it so that the image which is uploaded shows first (on the top of gallery). Does Dropzone have some built in methods that I could use?
var extraImageDropzone = new Dropzone('#extraImagesDropzone', {
url: "/uploads/upload",
maxFiles: 25,
acceptedFiles: 'image/*',
autoQueue: true,
addRemoveLinks: false,
parallelUploads: 1,
createImageThumbnails: false,
createImageData:false,
previewsContainer: null,
previewTemplate: '<li style="diplay:none"></li>',
hiddenInputContainer: "#extraImagesDropzoneToggle",
clickable: "#extraImagesDropzoneToggle",
// thumbnailWidth: 100,
thumbnailHeight: 100,
thumbnailMethod: `contain`,
complete: function(file, response) {
console.log('completed');
},
success: function(f, response) {
if (response.id) {
console.log('File uploaded' + response.URL);
$(".image-picker").data('picker').append_one(response.id, response.URL);
} else {
alert('Error while uploading');
this.removeFile(f);
}
}
});
Added prepend_one method to Image-picker lib and now works fine.
ImagePicker.prototype.prepend_one = function (val, image_src) {
var option = jQuery('<option>').val(val).attr('data-img-src', image_src);
this.select.prepend(option);
var picker_option = new ImagePickerOption(option[0], this, this.opts);
this.picker_options.push(picker_option);
this.picker.prepend(picker_option.node);
};
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.