使用Ajax MVC下载excel文件

Question

如何在MVC中使用Ajax下载文件。如果没有数据生成文件，则显示错误标签。 我想使用返回文件的操作结果方法。我可以下载文件。但不想刷新页面如果没有文件下载。 我的代码是这样

public ActionResult Excel(MyViewModel model) 

{ 

    var result = // DB call to get data 

    if (no data) 
    { 
     return **something** 
    } 
    else 
    { 
   byte[] excelContent =//passing result to my method(returns xls file in byte) 

     return File(
                    excelContent, "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", 
                    reportName + " Report " + startDate + " - " + endDate + ".xlsx"); 
    } 
} 

我应该返回东西 现在我回来emptyResult为东西所以我如果没有数据有空白页。 Ajax不支持文件下载。 如果我提交表单并且有数据，则此代码有效。 建议哪些页面不会刷新，并且两项任务都可以实现。 1.文件下载，如果数据 2.显示错误的标签，如果没有数据

Answer 1

1. 如果使用Ajax的话，最好的方法来创建API获取文件

2. 函数的返回类型为FileResult

   var exportToExcel = function (inputData, fileName) { 
   var path = "url"; 
   var form = $("<form></form>"); 
   form.attr("enctype", "application/x-www-form-urlencoded"); 
   form.attr("method", "post"); 
   form.attr("action", path); 
   form.attr("accept-charset", "UTF-8"); 
   
   var field = $("<input></input>"); 
   field.attr("type", "hidden"); 
   field.attr("name", "data"); 
   field.attr("value", escape(JSON.stringify(inputData))); 
   
   form.append(field); 
   var field2 = $("<input></input>"); 
   
   field2.attr("name", "fileName"); 
   field2.attr("value", fileName); 
   form.append(field2); 
   $(document.body).append(form); 
   form.submit().remove(); 
   

   } ;

   变种downloadFile =函数（inputData）{// 是checkFileHasResult AJAX调用的结果，如果真或假 checkFileHasResult（inputData）。然后（函数（hasFile）{ 如果（hasFile ===真）{// 给文件名加分机号 exportToExcel（inputData，“asdfasdf.csv”）; } }）; };

Answer 2

做在谷歌快速搜索，带来了相当多的成果，为this问题。

在JQuery中，您可以将'window.location'指向控制器中的操作方法，即返回FileResult。这会为你下载文件。

我建议您将消息返回给ajax调用，说明您的下载是否成功，然后您可以在前端设置某种文本以通知用户此过程不成功。

这是我将如何完成这一点。你可以调整它为你工作。这是一个控制器方法的例子。

[HttpGet] 
public JsonResult ExportCollection() 
{ 
    //Build your excel file, and save it to disk somewhere on server. 
    //you can also save it in session, depending on size 
    //Build up response Messages based on success or not 

    //return json object with your file path 
    return Json(new { responseMessage = responseMessage }, JsonRequestBehavior.AllowGet); 
} 

public ActionResult Download(string fileName) 
{ 
    return File(model.FilePath, "application/vnd.ms-excel", fileName); 
} 

然后，使用JQuery和Ajax调用从客户端调用这些操作。

$(document).on("click", "#YourButton", function() { 
     var url = "/YourController/ExportCollection/" 

     $("#responseText").text("We're getting things ready. Please wait..."); 
     $('#loadingImage').show(); 

     $.ajax({ 
      url: url, 
      type: "get", 
      success: function (responseMessage) { 
       patientCollectionExportSuccess(responseMessage); 
      } 
     }); 
    }) 

//Function responsible for exporting 
function patientCollectionExportSuccess(dataReceived) { 
    var respMessage = dataReceived.responseMessage; 

    if (respMessage != null) { 
     if (respMessage != "Error: Not Exported.") { 

      $("#responseText").text("Download completed."); 
      $('#loadingImage').hide(); 

      //set window.location to redirect to FileResult, which will download file 
      window.location = '/PatientListingQuery/Download?fileName=' + respMessage ; 
     } 
     else { 
      $("#responseText").text("Download unsuccessful."); 
      $('#loadingImage').hide(); 

      $("#responseText").text(dataReceived.responseMessage); 
     } 

    } 
} 

Answer 3

谢谢你们

我得到了解决 它顺利地为我的作品....

我的表单动作指向另一种方法，提交表单之前，所以更新动作。并在文件下载后，我将其设置为旧的表单操作。

$(document).ready(function() { 
    $('#excel-button').on('click', function() {    
     $.ajax({ 
      url: '/MyController/IsData', 
      type: 'POST', 
      data: $("#myForm").serialize(), 
      success: function (response) { 
       if (response == "True") { 
        var oldUrl=""; 
        var form1 = $('#myForm'); 

        var frm = document.getElementById('myForm') || null; 
        if (frm) { 
          oldUrl = frm.action; 
         frm.action = '/MyController/GenerateExcel'; 
        } 

        form1.submit(); 
        frm.action = oldUrl; 
        $('.error-Message').hide(); 

       }     else {       

        $('.error-Message').show(); 

       } 
      } 
    }); 
    });