快捷導(dǎo)航

jqgrid 表格數(shù)據(jù)導(dǎo)出實例

更新時間：2013年11月21日 14:59:50 作者：

jqgrid并沒有自帶導(dǎo)出表格數(shù)據(jù)的方法，這里就自己實現(xiàn)了一個，嘗試過在頁面直接將數(shù)據(jù)導(dǎo)出，發(fā)現(xiàn)只有IE下可以通過調(diào)用saveas來實現(xiàn)，但是別的瀏覽器不支持，于是考慮將數(shù)據(jù)傳回后臺，然后后臺返回下載文件來實現(xiàn)

首先，是一段javascript腳本：

復(fù)制代碼代碼如下:

/**
*
*
* @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") {
        <SPAN style="WHITE-SPACE: pre"> </SPAN>content = getTblData($('#' + table_id), $('#' + container_id), rownumbers);
        }
        if (content == "") {
            alert("表格不存在");
            return;
        }
        var fileName = getExcelFileName(title);

        doFileExport($('#' + form_id), fileName, content);
    }
    catch (e) {
        alert("導(dǎo)出異常:" + 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) {
            <SPAN style="WHITE-SPACE: pre">   </SPAN>var temp = $(row[each]).text();
            <SPAN style="WHITE-SPACE: pre">   </SPAN>if($(row[each]).text() == null || $(row[each]).text() == ""){
            <SPAN style="WHITE-SPACE: pre">       </SPAN>if(row[each].charAt(0) != '<')
            <SPAN style="WHITE-SPACE: pre">           </SPAN>outStr += row[each] + ",";
            <SPAN style="WHITE-SPACE: pre">       </SPAN>
            <SPAN style="WHITE-SPACE: pre">   </SPAN>}
            <SPAN style="WHITE-SPACE: pre">   </SPAN>else
            <SPAN style="WHITE-SPACE: pre">       </SPAN>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) {
<SPAN style="WHITE-SPACE: pre"> </SPAN>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();
}

接著是頁面調(diào)用的javascript：

復(fù)制代碼代碼如下:

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

復(fù)制代碼代碼如下:

復(fù)制代碼代碼如下:

//下載   
$('#download_file').click(function() {  
    getXlsFromTbl('keyword_detail', 'table_container' ,'download_form', '關(guān)鍵詞詳細(xì)數(shù)據(jù)', true)  
});  

您可能感興趣的文章: