When I am trying to use the download button to download file in laravel ajax, it is not working properly and I am not able to download file.
Below is my code:
<button type="button" request_id="'.$data->id.'" class="btn btn-success download_request_btn" > Download </button>';
Controller:
public function downloadReport(Request $request) { $request_id = $request->request_id; $downloadReport = Upload::where('id', $request_id)->first(); $upload_report = $downloadReport->upload_report; $headers = array( 'Content-Type: application/pdf', 'Content-Type: application/docx', ); $url= url('storage/documents/request/'. $upload_report); return response()->download($url); }
Ajax:
$(document).on('click', '.download_request_btn', function(){ var request_id = $(this).attr('request_id'); console.log(request_id); var formData = new FormData(); formData.append('request_id',request_id); jQuery.ajax({ type: "post", url: site_url+"/DownloadAjax", data: formData, contentType:false, processData:false, success: function (res) { } }); });
Advertisement
Answer
Just to pseudo-code it up with trusting your data is coming back as desired I think you need to trigger the download in your success callback with a variation of the following (may need to adjust to your need):
$(document).on('click', '.download_request_btn', function(){ var request_id = $(this).attr('request_id'); console.log(request_id); var formData = new FormData(); formData.append('request_id',request_id); jQuery.ajax({ type: "post", url: site_url+"/DownloadAjax", data: formData, contentType:false, processData:false, success: function (res) { const data = res; const link = document.createElement('a'); link.setAttribute('href', data); link.setAttribute('download', 'yourfilename.extensionType'); // Need to modify filename ... link.click(); } }); });