JQuery按照form下载文件+后台asp.net,非ajax(上)

原创 2015年11月18日 13:11:24

最近搞web开发,发现要从服务器下载文件,折腾了很久。

项目采用的easyui一套框架,通过ajax发现无法下载到文件。后来找了很多文章看,最后才发现用表单方式搞定了。

还有了,后台用的是asp.net,框架是别人写好的,发现用GET方式竟然不行,最后采用了POST方式。

先看看效果。点击 全部导出按钮时


直接弹框。



效果是达到了。

那接下看看代码层面是怎么做到的。

代码:

1、前端JS+EASYUI

<a href="#" class="easyui-linkbutton" data-options="width:60" data-bind="click:OnExport">全部导出</a>
通过事件触发
OnExport

看看事件的处理。

self.OnExport = function () {
            var url = "/RestAPI/Business/Post?businessname=@bizId&businessaction=GetWithdrawRecord&token=@tokenId";
            var form = $("<form>");   //定义一个form表单
            form.attr('style', 'display:none');   //在form表单中添加查询参数
            form.attr('target', '');
            form.attr('method', 'POST');
            form.attr('action', url);
                        
            var status = $('<input>');
            status.attr('type', 'hidden');
            status.attr('name', 'status');
            status.attr('value', self.displaydata.status());
            var timetype = $('<input>');
            timetype.attr('type', 'hidden');
            timetype.attr('name', 'timetype');
            timetype.attr('value', self.displaydata.timetype());
            var accountNo = $('<input>');
            accountNo.attr('type', 'hidden');
            accountNo.attr('name', 'accountNo');
            accountNo.attr('value', self.displaydata.accountNo());
            $('body').append(form);  //将表单放置在web中
            form.append(status);   //将查询参数控件提交到表单上
            form.append(timetype);   //将查询参数控件提交到表单上
            form.append(accountNo);   //将查询参数控件提交到表单上
            form.submit();
   
        };

这种方式是通过POST方式处理,将表单掩藏。将数据通过POST提交。


这就是整个前端处理。


版权声明:本文为博主原创文章,未经博主允许不得转载。

jquery ajax提交form参数 对应asp.net MVC强类型参数

转载地址:http://blog.163.com/guohuanhuan_cool@126/blog/static/16761423820130222512427/ 今天在研究jquery用aj...

利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法。

先来个简单的实例热热身吧。 1、无参数的方法调用 asp.net code: using System.Web.Script.Services;         [WebMethod]...

Asp.net中JQuery、ajax调用后台方法总结

通过上一篇文章实例的实现,整个过程当中学习到很多知识点,了解了Jquery、Ajax在asp.net中的运用,加以总结,其实原理都是一样的,理解了一种,其他的注意很少的区别就可以了、灵活运用: 主要...
  • lishehe
  • lishehe
  • 2013年11月01日 08:57
  • 12974

asp.net :使用jquery 的ajax +WebService+json 实现无刷新去后台值

====================================================== 注:本文源代码点此下载 =============================...

Asp.net中JQuery、ajax调用后台方法总结

Asp.net中JQuery、ajax调用后台方法总结 2013-11-04 08:26:26     我来说两句       作者:李社河 收藏    我要投稿 通过上一篇文章...

JQuery的$.ajax()调用asp.net的后台方法样例代码

引入头文件:                                using System.Web.Script.Services;                           ...
  • amohan
  • amohan
  • 2012年07月27日 19:17
  • 881

JQuery Ajax调用asp.net后台方法

1、无参数的方法调用 asp.net code: [c-sharp] view plaincopy using System.Web.Scri...

利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法。

[WebMethod]   命名空间 1、无参数的方法调用, 注意:1.方法一定要静态方法,而且要有[WebMethod]的声明 后台: 1 2 ...

jQuery.ajax()调用asp.net后台方法

利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法。先来个简单的实例热热身吧。1、无参数的方法调用C#后台代码: Code highlighting produced by A...
  • jackljf
  • jackljf
  • 2011年06月06日 23:17
  • 965
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JQuery按照form下载文件+后台asp.net,非ajax(上)
举报原因:
原因补充:

(最多只允许输入30个字)