JQuery Ajax Webメソッドを使用してファイルをダウンロードしたいのですが、機能しません。
これが私のjQueryajaxのwebメソッドへの呼び出しです:
function GenerateExcel() {
var ResultTable = jQuery('<div/>').append(jQuery('<table/>').append($('.hDivBox').find('thead').clone()).append($('.bDiv').find('tbody').clone()));
var list = [$(ResultTable).html()];
var jsonText = JSON.stringify({ list: list });
$.ajax({
type: "POST",
url: "GenerateMatrix.aspx/GenerateExcel",
data: jsonText,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
},
failure: function (response) {
alert(response.d);
}
});
}
これはWebメソッドの定義です。
[System.Web.Services.WebMethod()]
public static string GenerateExcel(List<string> list)
{
HttpContext.Current.Response.AppendHeader("content-disposition", "attachment;filename=FileEName.xls");
HttpContext.Current.Response.Charset = "";
HttpContext.Current.Response.Cache.SetCacheability(HttpCacheability.NoCache);
HttpContext.Current.Response.ContentType = "application/vnd.ms-Excel";
HttpContext.Current.Response.Write(list[0]);
HttpContext.Current.Response.End();
return "";
}
それを成し遂げる方法は?私を助けてください。
もう1つ、サーバーに保存するのではなく、クライアントPCにダウンロードしたい。
よく私はiframeを使用してそれをしました
これは変更されたajax関数呼び出しです
function GenerateExcel() {
var ResultTable = jQuery('<div/>').append(jQuery('<table/>').append($('.hDivBox').find('thead').clone()).append($('.bDiv').find('tbody').clone()));
var list = [$(ResultTable).html()];
var jsonText = JSON.stringify({ list: list });
$.ajax({
type: "POST",
url: "GenerateMatrix.aspx/GenerateExcel",
data: jsonText,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
if (isNaN(response.d) == false) {
$('#iframe').attr('src', 'GenerateMatrix.aspx?ExcelReportId=' + response.d);
$('#iframe').load();
}
else {
alert(response.d);
}
},
failure: function (response) {
alert(response.d);
}
});
}
これがデザイン部分です
<iframe id="iframe" style="display:none;"></iframe>
ページの読み込み時に私のコードは次のようになります
Response.AppendHeader("content-disposition", "attachment;filename=FileEName.xls");
Response.Charset = "";
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.ContentType = "application/vnd.ms-Excel";
Response.Write(tableHtml);
Response.End();
これらをビューページに追加します-
<iframe id="iframe" style="display:none;"></iframe>
<button id="download_file">Download</button>
サーバ側
public string Download(string file)
{
string filePath = Server.MapPath(System.Configuration.ConfigurationManager.AppSettings["FileManagementPath"]);
string actualFilePath = System.IO.Path.Combine(filePath, file);
HttpContext.Response.ContentType = "APPLICATION/OCTET-STREAM";
string filename = Path.GetFileName(actualFilePath);
String Header = "Attachment; Filename=" + filename;
HttpContext.Response.AppendHeader("Content-Disposition", Header);
HttpContext.Response.WriteFile(actualFilePath);
HttpContext.Response.End();
return "";
}
このコードをJavaScriptに追加します
<script>
$('#download_file').click(function(){
var path = 'e-payment_format.pdf';//name of the file
$("#iframe").attr("src", "/FileCabinet/Download?file=" + path);
});
</script>
それはうまくいくはずです!
C#コードがExcelの正しいヘッダーで応答すると仮定すると、ajaxを使用する代わりに、リンクにリダイレクトするだけで済みます。
var list = [$(ResultTable).html()];
var url = "GenerateMatrix.aspx/GenerateExcel";
var data = {list: list};
url += '?' + decodeURIComponent($.param(data));
// if url is an Excel file, the browser will handle it (should show a download dialog)
window.location = url;