form请求导出表格_采用Post请求的方式提交参数并导出excel

一般情况下，我们都是采用get请求的方式导出excel。例如采用如下方式：

var exportUrl = ‘/xxx;‘;

window.open(exportUrl);

导出excel所需的逻辑参数拼接到url上即可。

但是，如果我们需要提交大量的参数到后台才能导出excel， 亦或者我们提交的参数中有中文，get提交乱码了，那么就可能想使用post提交的方式来导出excel。因为post提交支持更多的参数，从而能解决get提交对url长度的限制问题。

然而，一般的post提交表单，意味着主页面也会一起刷新，体验较差。那么，这里将提供一个仿异步post提交导出excel的实例。

代码如下：

_export = {

canExport:false,

post:function(data,exportUrl) {

_export.canExport = true;

if ($(‘#exportIframe‘).length > 0) {

$(‘#exportIframe‘).remove();

}

$(‘body‘).append(‘

‘);

$(‘#exportIframe‘).load(function() {

if (_export.canExport) {

var formData = ‘

‘; for (var name in data) { formData = formData + ‘‘; } formData = formData + ‘‘; formData = formData + ‘

‘;

$(this).contents().find(‘body‘).append(formData);

$(this).contents().find(‘#submitExportForm‘).click();

_export.canExport = false;

}

});

}

}

调用方式：

_export.post(submitData,exportUrl);

注意，这里的submitData是使用jquery构建key:value的form参数对象。传入导出方法后被解析还原成form表单数据。

代码的思路就是，利用隐藏的iframe内嵌模块，在iframe内部post表单提交导出我们想要的数据，页面翻转也仅发生在iframe内部，

我们的主页面并不会发生翻转，从而达到仿异步post导出的效果。