Using dropzone I would browse for a image file and the preview image would be displayed on the class "dropzone-previews". On the below the button trigger, how I can send "dropzone-previews" to another new page and display the image from there?
HTML
<form action="/upload-file" type="file" class="dropzone" id="upload-file-form" enctype="multipart/form-data">
<div class="filepicker"></div>
<div class="addFileButton">browse</div>
</form>
<button type="submit" class="btn btn-success pull-right"` id="btnUpload">Upload</button>
<div class="dropzone-previews"></div>
JS
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone('#upload-file-form', {
paramName: "file",
url: '/upload-file',
method: 'post',
acceptedFiles: ".png,.jpg,.gif,.jpeg",
maxFilesize: 256,
maxFiles: 1,
maxfilesexceeded: function(file) {
this.removeAllFiles();
this.addFile(file);
},
parallelUploads: 1,
uploadMultiple: false,
autoProcessQueue: false,
addRemoveLinks: false,
clickable: ".addFileButton",
previewsContainer: ".dropzone-previews",
});
$('#btnUpload').on('click', function(){
//redirect to new page (i.e myNewPage.php) along with the image
window.location.replace("");
});