I'm using dropzone.js with Laravel.
I'm submitting files with two different buttons (see image below).
When Merge and Upload as one file is clicked I want to send this button value to the controller.
When Save each file separately is clicked I want to send this button value controller.
I take a global variable which is input
, which is working fine, but the problem is when I hit a button it sends the old value and not the current value.
Thanks for your help.
Here is my form:
<form action="{{route('mediamanager.store')}}" class="dropzone dropzone-nk needsclick" id="my-awesome-dropzone" method="post" enctype="multipart/form-data">
{{ csrf_field() }}
<div>
<i class="notika-icon notika-cloud"></i>
<div class="fallback">
<input name="file" type="file" multiple />
</div>
<h2>Drop files here or click to upload.</h2>
</div>
</div>
<br>
<div class="text-center">
<input type="button" class="btn-success submit-merge" id="merge_file" value="Merge and Upload as one file" style="padding:0.8em">
<input type="button" class="btn-success submit-separate" id="separate_file" value="Save each file separatly">
</div>
</form>
Here is the script for the dropzone:
<script>
Dropzone.options.myAwesomeDropzone = { // The camelized version of the ID of the form element
// The configuration we've talked about above
autoProcessQueue: false,
uploadMultiple: true,
parallelUploads: 25,
maxFiles: 25,
acceptedFiles:'.pdf',
// The setting up of the dropzone
init: function() {
var myDropzone = this;
var input = 'Null';
$(".submit-merge").click(function (e)
{
alert('
<input >
');
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
input = 'merge_file';
console.log(input);
});
$(".submit-separate").click(function (e) {
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
input = 'separate_file';
console.log(input);
});
// });
// $(".submit-separate").click(function (e) {
this.on("sendingmultiple", function(file, xhr, formData) {
//Add additional data to the upload
formData.append(input, $('#'+input).val());
});
this.on("success", function(file, responseText) {
// location.reload();
console.log('dfd');
});
}
}
</script>
You are changing the input value after processQueue()
.
in place of
$(".submit-merge").click(function (e) {
alert('
<input >
');
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
input = 'merge_file';
console.log(input);
});
$(".submit-separate").click(function (e) {
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
input = 'separate_file';
console.log(input);
});
Try:
$(".submit-merge").click(function (e) {
alert('
<input >
');
e.preventDefault();
e.stopPropagation();
input = 'merge_file';
console.log(input);
myDropzone.processQueue();
});
$(".submit-separate").click(function (e) {
e.preventDefault();
e.stopPropagation();
input = 'separate_file';
console.log(input);
myDropzone.processQueue();
});
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.