在 .NET MVC JQuery Ajax 调用下载数据为 .csv

Question

我对控制器进行了 ajax 调用，以获取以下格式的逗号分隔数据，

public ActionResult GetSearchDataforDownloadtoCSV(string pSearchbykeyword, string pRequestCode)
{
   ReportsBE _lReportsBE = new ReportsBE();
   _lReportsBE.SearchKeyword = pSearchbykeyword;
   _lReportsBE.RequestCode = pRequestCode;

     List<ReportsBE> lstResult = new List<ReportsBE>();
     lstResult = _objReports.GetPackagelistAll_Search(_lReportsBE);

    StringBuilder sb = new StringBuilder();
    sb.Append("Request");
    sb.Append(",");
    sb.Append("Description");
    sb.Append("\n");

    foreach (var _RepBE in lstResult)
    {

        if (_RepBE.RequestCode != null)
        sb.Append(Escape(_RepBE.RequestCode));
        sb.Append(",");
        if (_RepBE.Description != null)
        sb.Append(Escape(_RepBE.Description));

        sb.Append("\n");
    }

return Json(sb.ToString());
}

这是我的 HTML，

@Html.LabelFor(model => model.SearchKeyword, "Search Packages by Keyword")
@Html.TextBoxFor(model => model.SearchKeyword, new { style = "width: 500px;" })

<button type="button" id="btnExport" onclick="DownloadCSV()" value="Export to CSV">Export to CSV</button>

这是我的 ajax 调用，

function DownloadCSV() {
        var _pSearchbykeyword = $('#SearchKeyword').val();
        var _pRequestCode = $('#RequestCode').val(); 

        var postData = {
            pSearchbykeyword: _pSearchbykeyword == '' ? '' : _pSearchbykeyword
            , pRequestCode: _pRequestCode == '' ? '' : _pRequestCode
        };

        $.ajax({
            type: 'POST',
            url: '@Url.Action("GetSearchDataforDownloadtoCSV", "Reports")',
            data: postData,
            success: function (data) {
                if (data != null) {
                    // need to code here to through comma seperated data as csv file...
                }
            },
            error: function (xhr, ErrorText, thrownError) {
                alert("No Records Found!");

            }
        });

    }

我的问题是将控制器返回的逗号分隔字符串下载为 .csv 文件。 请帮忙。

我尝试通过如下文件，

var uri = 'data:text/csv;charset=utf-8,' + escape(data);
var downloadLink = document.createElement("a");
downloadLink.href = uri;
downloadLink.download = "SearchList.csv";
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);

由于查询字符串的限制，此代码在 chrome 中运行，但在 IE 中不运行。任何帮助将非常感激。谢谢。

Answer 1

不要使用 AJAX，而是使用标准 HTML <form>:

@using (Html.BeginForm("GetSearchDataforDownloadtoCSV", "Reports"))
{
    @Html.LabelFor(model => model.RequestCode, "Request Code")
    @Html.TextBoxFor(model => model.RequestCode, new { style = "width: 500px;" })


    @Html.LabelFor(model => model.SearchKeyword, "Search Packages by Keyword")
    @Html.TextBoxFor(model => model.SearchKeyword, new { style = "width: 500px;" })

    <button type="submit" value="Export to CSV">Export to CSV</button>
}

您无法使用 AJAX 请求下载文件的原因是您无法在 javascript 中显示“另存为”对话框。因此，您无法在 AJAX 成功回调中执行任何操作来提示用户保存文件。这就是为什么最简单的解决方案是使用标准表单或直接指向将提供 CSV 文件的控制器操作的锚点。

Answer 2

就个人而言，我会使用FileResult 操作类型而不是通用的ActionResult 方法：

    public FileResult Download(long id)
    {
        var fileData = GetSearchDataforDownloadtoCSV(...);
        // use application/octet-stream for file downloads, saves us needing to
        // infer MIME type
        return File(fileData, "application/octet-stream", "Filename.csv");
    }

这样，您根本不需要使用 AJAX。

Answer 3

这就是我根据 Darin Dimitrov 和 Richard A. cmets 解决的方法，

public FileResult GetSearchDataforDownloadtoCSV(string pSearchbykeyword, string pRequestCode)
{
   ReportsBE _lReportsBE = new ReportsBE();
   _lReportsBE.SearchKeyword = pSearchbykeyword;
   _lReportsBE.RequestCode = pRequestCode;

     List<ReportsBE> lstResult = new List<ReportsBE>();
     lstResult = _objReports.GetPackagelistAll_Search(_lReportsBE);

    StringBuilder sb = new StringBuilder();
    sb.Append("Request");
    sb.Append(",");
    sb.Append("Description");
    sb.Append("\n");

    foreach (var _RepBE in lstResult)
    {

        if (_RepBE.RequestCode != null)
        sb.Append(Escape(_RepBE.RequestCode));
        sb.Append(",");
        if (_RepBE.Description != null)
        sb.Append(Escape(_RepBE.Description));

        sb.Append("\n");
    }

byte[] buffer = System.Text.Encoding.UTF8.GetBytes(sb.ToString());
return File(buffer, "text/csv", "SearchList.csv");
}

在我的 Javascript 中，

function DownloadCSV() {
        var _pSearchbykeyword = $('#SearchKeyword').val();
        var _pRequestCode = $('#RequestCode').val();

        pSearchbykeyword= _pSearchbykeyword == '' ? '' : _pSearchbykeyword;
        pRequestCode = _pRequestCode == '' ? '' : _pRequestCode;

        window.location = "Reports/GetSearchDataforDownloadtoCSV?pSearchbykeyword=" + pSearchbykeyword + "&pRequestCode=" + pRequestCode;
    }

这就像一个魅力......:)