jqgrid 表格数据导出

jqgrid 表格数据导出

jqgrid并没有自带导出表格数据的方法，这里就自己实现了一个，尝试过在页面直接将数据导出，发现只有IE下可以通过调用saveas来实现，但是别的浏览器不支持，于是考虑将数据传回后台，然后后台返回下载文件来实现。

首先，是一段javascript脚本：

/**
 * 
 * 
 * @param table_id 表格的id
 * @param container_id 容器的id
 * @param form_id 提交表单的id
 * @param title 文件名
 * @param rownumbers
 */
function getXlsFromTbl(table_id, container_id ,form_id, title, rownumbers) {
    try {
        var content = "";


        if (table_id != null && table_id != "" && table_id != "null") {
        	content = getTblData($('#' + table_id), $('#' + container_id), rownumbers);
        }
        if (content == "") {
            alert("表格不存在");
            return;
        }
        var fileName = getExcelFileName(title);
        
        doFileExport($('#' + form_id), fileName, content);
    }
    catch (e) {
        alert("导出异常:" + e.name + "->" + e.description + "!");
    }
}
function getTblData(tableobj, containerobj, rownumbers) {


    var outStr = "";
    if (tableobj != null) {
        var rowdata = tableobj.getRowData();
        var Lenr = 1;


        for (i = 0; i < Lenr; i++) {
            //var Lenc = curTbl.rows(i).cells.length;
            var th;
            if (rownumbers == false) {
                th = containerobj.find('TH:not(:first-child)');
            }
            else {
                th = containerobj.find('TH');
            }
            th.each(function(index, element) {
                var j = index + 1;
                var content = $(element).text();
                content = content.replace(/(^\s*)|(\s*$)/g, "");//去掉空格
                outStr += content + ",";
            });
            outStr += "+nl+";
        }
        var tmp = "";
        for (i = 0; i < rowdata.length; i++) {
            var row = eval(rowdata[i]);
            for (each in row) {
            	var temp = $(row[each]).text();
            	if($(row[each]).text() == null || $(row[each]).text() == ""){
            		if(row[each].charAt(0) != '<')
            			outStr += row[each] + ",";
            		
            	}
            	else
            		outStr += $(row[each]).text() + ",";
            }
            outStr += "+nl+";
        }
    }
    else {
        outStr = null;
        alert(inTbl + " null!");
    }
    return outStr;
}
function getExcelFileName(title) {
    var d = new Date();
    var curYear = d.getYear();
    var curMonth = "" + (d.getMonth() + 1);
    var curDate = "" + d.getDate();
    var curHour = "" + d.getHours();
    var curMinute = "" + d.getMinutes();
    var curSecond = "" + d.getSeconds();
    if (curMonth.length == 1) {
        curMonth = "0" + curMonth;
    }
    if (curDate.length == 1) {
        curDate = "0" + curDate;
    }
    if (curHour.length == 1) {
        curHour = "0" + curHour;
    }
    if (curMinute.length == 1) {
        curMinute = "0" + curMinute;
    }
    if (curSecond.length == 1) {
        curSecond = "0" + curSecond;
    }
    var fileName = title + "_" + curYear + curMonth + curDate + "_"
            + curHour + curMinute + curSecond + ".csv";


    return fileName;
}
function doFileExport(formobj, filename, content) {
	formobj.html("<input id='filename' name='filename' type='text' style='display: none'><input id='content' name='content' type='text' style='display: none'>");
    $("#filename").val(filename);
    $("#content").val(content);
    formobj.submit();
} 

接着是页面调用的javascript：

<form id="download_form" method="post"  target="_blank" action="downLoadTableDataAction">

<div id="table_container">
	<table id="keyword_detail"></table>
	<div id="footer"></div>
</div>

//下载
$('#download_file').click(function() {
    getXlsFromTbl('keyword_detail', 'table_container' ,'download_form', '关键词详细数据', true)
});

然后是后台的java程序：

import java.io.BufferedOutputStream;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.log4j.Logger;

public class DownLoadTableDataAction extends HttpServlet {
	
	static Logger log = Logger.getLogger(DownLoadTableDataAction.class);
	
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		
		if(log.isInfoEnabled())
			log.info("DownLoadTableDataAction is starting ...");
		
		req.setCharacterEncoding("utf-8");
		resp.setCharacterEncoding("gbk");
		
		String content = req.getParameter("content");
		String filename = req.getParameter("filename");
		
		content = content.replace("+nl+", "\n");
		resp.setContentType("application/octet-stream;charset=gbk"); 
		resp.setHeader("content-disposition", "attachment;filename=" + filename);
		BufferedOutputStream write = new BufferedOutputStream(resp.getOutputStream());  
		write.write(content.getBytes("gbk"));
		write.flush();
		write.close();
		
		 if(log.isInfoEnabled())
				log.info("DownLoadTableDataAction has completed ...");
	}
}