difficulty sending Excel Workbook from Servlet

My project involves creating an HTML page that has a Table and placing a button on the page labelled "Export To Excel". The whole purpose is to convert the Table data into an Excel file that can be downloaded from the servlet. Using JQuery I had no problem collecting all the data from the Table and sending it off to the Servlet using the following code:

$("#export").click(function(){
    var head = JSON.stringify({ header: header });
    var table = JSON.stringify({ data: data });
    //Combine the two into on big object
    var obj = head.substring(0,head.length - 1) + "," + table.substring(1,table.length);
    $.ajax({
            type: "POST",
            url: 'ExportToExcel',
            data: obj,
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            mimeType: 'application/json',
            error: function (xhr, ajaxOptions, thrownError) {
                $('#result').html(thrownError + "<br/><br/>" +
                                          xhr.responseText);
            }
        })                      
    });

Here's my Servlet code:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    try{
      BufferedReader br = new BufferedReader(new InputStreamReader(request.getInputStream()));
      String json = "";
      if(br != null){
        json = br.readLine();
      }
      //System.out.println("json: " + json);
      br.close();
      Gson gson = new Gson();
      Table table = gson.fromJson(json, Table.class);
      ArrayList<String> header = table.getHeader();
      ArrayList<String[]> data = table.getData();

      XSSFWorkbook wb = new XSSFWorkbook();
        //CreationHelper createHelper = wb.getCreationHelper();
        XSSFSheet sheet = wb.createSheet("Sheet1");
        //create the Header
        XSSFRow rowhead = sheet.createRow(0);
        for(int i = 0; i < header.size(); i++)
        {
            rowhead.createCell(i).setCellValue(header.get(i));
        }

        XSSFRow row = null;
        XSSFCell cell = null;
        String[] temp = null;
        for(int i = 0; i < data.size(); i++)
        {
            temp = data.get(i);
            row = sheet.createRow(i);
            for(int j = 0; j < temp.length; j++)
            {
                cell = row.createCell(j);
                cell.setCellType(XSSFCell.CELL_TYPE_STRING );
                cell.setCellValue(temp[j]);
            }

        }

        //response.setContentType("application/vnd.ms-excel");
        response.setContentType("application/vnd.openxml");
        //response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
        String filename = "data.xlsx";
        response.setHeader("Content-disposition", "attachment; filename=\"" + filename + "\"" );
        ServletOutputStream out = response.getOutputStream();
        wb.write(out);  
        out.flush();
        out.close();


    }
    catch(Exception e){e.printStackTrace();}

}

class Table
{
    private ArrayList<String> header;
    private ArrayList<String[]> data;

    public void setHeader(ArrayList<String> list)
    {
        header = list;
    }

    public ArrayList<String> getHeader()
    {
        return header;
    }

    public void setData(ArrayList<String[]> value)
    {
        data = value;
    }

    public ArrayList<String[]> getData()
    {
        return data;
    }
}

As you can see from the Servlet code, I am easily able to create a Workbook and place in it all the data sent via JSON string. So far so good.

For a response back from the Servlet I get the following in FireBug:

Response Headers
Content-Disposition attachment; filename="data.xlsx"
Content-Type application/vnd.openxml
Date Mon, 03 Mar 2014 20:56:15 GMT
Server Apache-Coyote/1.1
Transfer-Encoding chunked

Also in FireBug under the Response tab I get a bunch of garbage characters:

I assume this is an error of some sort. From the JQuery Ajax error function I get: SyntaxError: JSON.parse: unexpected character. I don't know what that's about??? The browser doesn't prompt me to save the file anywhere. I tried in both Firefox and IE browsers, and the result is the same. I've tried changing the ContentType back and forth between: application/vnd.openxml and application/vnd.ms-excel, but again the result is the same.

Is someone able to show me where I am going wrong? I want the browser to prompt me as to where I want to put the file. Thanks.

I work with a really old codebase and the company's policy is "If it aint broke don't fix it", so here's how our servlet response for XLSX Export looks.

response.setHeader("Expires", "0");
response.setHeader("Content-disposition", "attachment;filename=" + exportTitle + "_" + fileDate + ".xlsx"); // I noticed you had "/" before and after the filename, try removing that, and add the extension.
response.setHeader("Cache-Control", "must-revalidate, post-check=0, pre-check=0");
response.setHeader("Pragma", "public");
response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"); // Our legacy code actually has "application/xlsx" and it works fine - but [other answers indicate better](https://stackoverflow.com/questions/974079/setting-mime-type-for-excel-document)

... For your AJAX I would try removing dataType specification, since your response header defines it, jQuery should just "roll" with it. I believe the mimeType and contentType are used to define what's sent to the server (which you've seemed to have indicated is working fine), so I wouldn't focus too much on that.