Dropzone - send image to controller with other form data on submit - php

Question

I'm working in laravel 5.3 project.
before asking question I have tried these links :
1st , 2nd , 3rd , 4th ,5th but no luck.
let me show you my code.
details.blade.php
<form class="form" method="post" action="{{url('add_user_photo_gallery')}}" id="my-awesome-dropzone" name="validate_resume">
<input name="_token" type="hidden" value="{{ csrf_token() }}"/>
<div class="card-body">
<div class="row">
<div class="col-md-12 col-sm-12 text-center">
<div class="form-group floating-label">
<div id="dropzonephoto" class="dropzone dz-clickable form-fileupload">
<div class="dz-message dz-default" style="text-align:center;">
<span>Click Here to upload Photo </span>
</div>
</div>
</div>
<small>jpg, png , jpeg - upto 1 Mb max</small>
</div>
<div class="col-md-12">
<input type="text" name="first_name" />
</div>
<div class="col-md-12">
<input type="text" name="last_name" />
</div>
<div class="col-md-12">
<input type="email" name="email" />
</div>
<div class="row">
<div class="col-md-12">
<input type="submit" id="btn_save_photo" class="custom-btn primary-btn pull-right" required>
<input type="reset" id="btn_reset_photo" class="custom-btn warning-btn pull-right" value="Cancle" required>
</div>
</div>
</div>
</div>
</form>
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone('#dropzonephoto', { // Make the whole body a dropzone
url: base_path + '/add_user_photo_gallery',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
paramName: "images",
parallelUploads: 1,
maxFilesize: 1.0,
maxFiles:20,
acceptedFiles: ".png,.jpg,.jpeg",
dictInvalidFileType: 'This file type is not supported.',
dictFileTooBig:'File size too Big',
addRemoveLinks: true
});
public function add_user_photo_gallery(Request $request){
dd($request->all());
}
In my controller function I print request that coming from form. I'm getting all the field except dropzone image.
using above dropzone script when I select image it's immediately go to controller and I can see all image details in console / network.I don't want that so I added below code in my script.
autoProcessQueue:false,
$('#btn_save_photo').on('click',function(e){
e.preventDefault();
myDropzone.processQueue();
});
After add this code image is upload on submit button but other form element is not submitted. and this upload process is shown in inspect element / network section .
So what I want is on submit button want to page refresh and print all form data with dropzone image.
Anyone is here to solve my problem ?