教程集 www.jiaochengji.com
教程集 >  脚本编程  >  Asp.net  >  正文 asp.net mvc javascript生成下载文件的例子

asp.net mvc javascript生成下载文件的例子

发布时间:2016-11-27   编辑:jiaochengji.com
教程集为您提供asp.net mvc javascript生成下载文件的例子等资源,欢迎您收藏本站,我们将为您提供最新的asp.net mvc javascript生成下载文件的例子资源
来看一个关于asp.net mvc javascript生成下载文件的,生成文件一直是直接的下载地址,但这里带了js是不是有一点不一样,各位来看看。

近期做的是对现有项目进行重构。WEB FROM改成MVC,其实也算是推倒重来了。

里面有一个导出功能,将数据输出成txt文件,供下载。原先的做法是有一个隐藏的iframe,在这个iframe的页面中设置一个表单form,将相关参数提交到服务器端;而在服务器端,是真的生成一个文件,然后再将文件内容往客户端推送。


好奇怪的做法啊。将内容导出,让用户下载,不必真的生成文件的,因为内容千变万化,没有一次生成,多次使用的可能和必要。完全可以将内容生成后,直接往客户端推送。


其次,我理解原先为何要用一个隐藏的iframe。因为提交页面会导致刷新,为了避免页面内容刷新,于是搞了个隐藏的iframe,让它来负责提交。好是好,就是要多搞一个页面。


在新项目里面,前端,form由JS动态生成;服务器端,直接生成内容并推送:


前端:

<table width="620" align="center" border="0" cellpadding="1" cellspacing="1" style="background:#FB7"> <tr> <td width="464" height="27" bgcolor="#FFE7CE"> 代码如下</td> <td width="109" align="center" bgcolor="#FFE7CE" style="cursor:pointer;" onclick="doCopy('copy3287')">复制代码</td> </tr> <tr> <td height="auto" colspan="2" valign="top" bgcolor="#FFFFFF" style="padding:10px;" class="copyclass" id=copy3287>


<script type="text/javascript">
var f_pointXY = function () {
    function exportData() {//动态添加表单
  var form = $("<form>");
  form.attr('style', 'display:none');
  form.attr('target', '');
  form.attr('method', 'post');
  form.attr('action', "@Url.StaticFile("~/Common/YongHai/ExportData/")" $("#txt_SMID").val());
  var input1 = $('<input>');
  input1.attr('type', 'hidden');
  input1.attr('name', 'isExportInput');
  input1.attr('value', document.getElementById("chkInput").checked);
  var input2 = $('<input>');
  input2.attr('type', 'hidden');
  input2.attr('name', 'exportFormat');
  input2.attr('value', document.getElementById("Select1").value);
  $('body').append(form);
  form.append(input1);
  form.append(input2);
  try { form.submit(); } catch (ex) { alert(ex); }
  form.remove();//用完即弃
    }
    return {
  exportData: function () {
      exportData();
  }
    };
}();

</td></tr></table>


服务器端:

<table width="620" align="center" border="0" cellpadding="1" cellspacing="1" style="background:#FB7"> <tr> <td width="464" height="27" bgcolor="#FFE7CE"> 代码如下</td> <td width="109" align="center" bgcolor="#FFE7CE" style="cursor:pointer;" onclick="doCopy('copy5986')">复制代码</td> </tr> <tr> <td height="auto" colspan="2" valign="top" bgcolor="#FFFFFF" style="padding:10px;" class="copyclass" id=copy5986>

 

  [HttpPost]
public ActionResult ExportData(int id, FormCollection collection)
{
  string content = ...;//生成内容
  Response.Clear();
  Response.Buffer = false;
  Response.ContentType = "application/octet-stream";
  Response.AppendHeader("content-disposition", "attachment;filename=" DateTime.Now.ToString("yyyy-MM-dd") ".txt;");
  Response.Write(content);
  Response.Flush();
  Response.End();
  return new EmptyResult();
}

</td></tr></table>

这样,点击按钮导出按钮

 

<table width="620" align="center" border="0" cellpadding="1" cellspacing="1" style="background:#FB7"> <tr> <td width="464" height="27" bgcolor="#FFE7CE"> 代码如下</td> <td width="109" align="center" bgcolor="#FFE7CE" style="cursor:pointer;" onclick="doCopy('copy6983')">复制代码</td> </tr> <tr> <td height="auto" colspan="2" valign="top" bgcolor="#FFFFFF" style="padding:10px;" class="copyclass" id=copy6983><input type="button" value="导出" class="btn mini minilt" onclick="f_pointXY.exportData()" />
</td></tr></table>

之后,即可下载yyyy-MM-dd.txt矣

您可能感兴趣的文章:
asp.net mvc javascript生成下载文件的例子
JQuery 引发两次$(document.ready)事件
什么是MVC模式
使用jQuery轻松实现Ajax的实例代码
JavaScript MVC 学习笔记(一)初识JS MVC
asp.net MVC进阶学习---HtmlHelper控件解析(二)
每个ASP.NET MVC开发者必须了解的13个扩展点
ASP.NET MVC处理文件上传的例子
什么是MVC设计模式?
asp.net MVC进阶学习---HtmlHelper控件解析(三)

[关闭]
~ ~