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

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

var exportUrl = '/xxx;';
window.open(exportUrl);

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

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

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

代码如下:

  1.  _export =
  2.       canExport:false,
  3.       post:function(data,exportUrl){
  4.       _export.canExport =true;
  5.       if($('#exportIframe').length >0){
  6.             $('#exportIframe').remove();
  7.        }
  8. $('body').append('<iframe id="exportIframe" width="0" height="0" src="'+domain+'/export"></iframe>');
  9. $('#exportIframe').load(function(){
  10.       if(_export.canExport){
  11.             var formData ='<form method="post" action='+exportUrl+' >';
  12.             for(var name in data){
  13.             formData = formData +'<input type="text" name="'+name+'" value="'+data[name]+'" />';
  14.       }
  15.       formData = formData +'<input type="submit" id="submitExportForm"/>';
  16.       formData = formData +'</form>';
  17.       $(this).contents().find('body').append(formData);
  18.       $(this).contents().find('#submitExportForm').click();
  19.       _export.canExport =false;
  20.      }
  21.    });
  22.  }
  23. }

调用方式:

_export.post(submitData,exportUrl);

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

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

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

链接:  http://www.everycoding.com/coding/302.html

原文地址:https://www.cnblogs.com/18JG23/p/7488702.html