Question

我的视图中有一个devexpress网格，一个提交按钮，用于执行导出数据的操作。如果我这样做，它会执行操作并返回下载文件：

@using (Html.BeginForm("Export","Product"))
{
   <input type="submit" value="export"/>
}

但如果我像这样提交：

function OnCommandExecuted(s, e) {
    if (e.item.name == "SendData") {
        $.ajax({
            url: '/Product/Export'
        });
    }
}

js正常调用并执行操作，但不会返回下载。

我的行动代码：

    [HttpPost]
    public ActionResult Export()
    {
       return GridViewExtension.ExportToXls(CreateExportGridViewSettings(),  Session["product"] as List<Product>);
    }

我在操作中设置了一个断点，javascript代码正常调用该操作，但它不返回下载（没有任何错误）。我在这里失踪了什么？

Answer 1

你不应该使用AJAX来下载文件。但是如果你想使用JQuery AJAX来下载文件，你可以在JQuery中使用window.open（）并打开文件资源URL，这将触发下载。

让Action将保存URL的Json数据返回到文件资源 -

    public ActionResult Download(string fileId)
    {
        return new JsonResult(){ Data = "File URL to Download using fileId, probably with some querystrings", JsonRequestBehavior = JsonRequestBehavior.AllowGet};
    }

然后在你的JQuery中 -

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script>
    function submitForm() {
        jQuery.ajax({
            type: "POST",
            url: "@Url.Action("Download")",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({ fileId: "123"}),
            success: function (data) {
                window.open(data, "_blank");
            },
            failure: function (errMsg) {
                alert(errMsg);
            }
        });
    }
</script>

<input type="button" value="Click" onclick="submitForm()" />

然后当您单击按钮时，指向File的URL将从Action方法返回到JQuery。然后JQuery在新窗口中打开该URL并进行文件下载。

或者您也可以尝试JQuery FileDownload之类的插件，它可以提供下载文件的AJAX经验。

通过Ajax从Action返回结果时出错

1 个答案: