PHP not outputting CSV from ajax call - php

Question

I have a button that when clicked is supposed to submit variables to an ajax call which then a csv is created and downloaded but for some reason the file just isnt downloading. Yet I get the correct output in Chrome Dev tools:
Here is what I have:
index.php
<form class="navbar-form navbar-left" method="post">
<input hidden id="ajaxquery" value="<?php echo $ajaxquery;?>">
<button type="button" class="btn btn-success btn-lg" id="downloadcsv">Download CSV</button>
</form>
script.js
$(document).ready(function() {
var csvquery = function(){
function getUrlParameter(sParam)
{
var sPageURL = window.location.search.substring(1);
var sURLVariables = sPageURL.split('&');
for (var i = 0; i < sURLVariables.length; i++)
{
var sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] == sParam)
{
return sParameterName[1];
}
}
}
ajaxquery = $('#ajaxquery').val();
department = getUrlParameter('department');
startdate = getUrlParameter('startdate');
enddate = getUrlParameter('enddate');
staffsearch = getUrlParameter('staffsearch');
$.ajax({
type: 'POST', // type
url: '../report/csv.php', // request file the 'check_email.php'
data: {ajaxquery:ajaxquery, department: department, startdate:startdate, enddate: enddate, staffsearch: staffsearch},
success: function(responseText) {
}
}); // end success
}
$('#downloadcsv').click(csvquery);
});
csv.php
session_start();
require '../connect.php';
header('Content-Type: text/csv; charset=utf-8');
header('Content-Disposition: attachment; filename=data.csv');
$output = fopen('php://output', 'w');
fputcsv($output, array('Name', 'Department','Hours Worked', 'On Holiday', 'Ill' , 'Date'));
$sql = "SELECT time.id as timeid, time.staff_id, time.timein, time.onholiday, time.dateadded, time.ill, time.notes, staff.id AS staffid, department.id AS departmentid, department.department_name, staff.staff_name, staff.department_id FROM time, staff, department WHERE staff.id = time.staff_id AND staff.department_id = department.id ORDER BY `time`.`dateadded` ASC ;";
$rows = mysqli_query($connect, $sql);
while ($rowcsv = mysqli_fetch_assoc($rows)){
fputcsv($output, array($rowcsv['staff_name'],$rowcsv['department_name'],$rowcsv['timein'],$rowcsv['onholiday'],$rowcsv['ill'],$rowcsv['dateadded']));
};
readfile("php://output");

Answer 1

Change aJax to fileDownload:
$.fileDownload('../report/csv.php', {
httpMethod: 'POST',
data: {
ajaxquery:ajaxquery, department: department, startdate:startdate, enddate: enddate, staffsearch: staffsearch
},
successCallback: function (url) {
//insert success code
},
failCallback: function (html, url) {
//insert fail code
}
});
You can use jQuery fileDownload method through this js file:
https://github.com/johnculviner/jquery.fileDownload/blob/master/src/Scripts/jquery.fileDownload.js
More information at:
http://johnculviner.com/jquery-file-download-plugin-for-ajax-like-feature-rich-file-downloads/