導出到 jquery 或 jqGrid 中的 excel
[英]export to excel in jquery or jqGrid
問題描述
我有一個jqGrid ，我在其中一次從服務器（java）以 JSON 格式獲取數據。 我希望將 jqGrid 中的數據導出為 Excel 格式。
直到現在我看到這個頁面在 IE 'o.url is null or not an object' grid.import.js中給我一個錯誤
我還看到了這個演示，在導出按鈕的工具提示上它說Export To Excel但保存的文件是 xml 格式。
So I would like any suggestions that can either transform my JSON string into excel using javascript or jquery plugin or using jqgrid's inbuilt feature.
我的 jqGrid
我的 jqGrid 代碼
grid = jQuery("#list2");
grid.jqGrid({
datastr : comparePatchData,
datatype: 'jsonstring',
colNames:['Name',starheader, header1, header2],
colModel:[
{name:'elementName',index:'elementName', width:90},
{name:'isPrasentinXml1',index:'isPrasentinXml1', width:100, align:'center', formatter: patchPresent},
{name:'isPrasentinXml2',index:'isPrasentinXml2', width:100, align:'center', formatter: patchPresent},
{name:'isPrasentinXml3',index:'isPrasentinXml3', width:100, align:'center', formatter: patchPresent}
],
pager : '#gridpager2',
rowNum:12,
scrollOffset:0,
height: 320,
autowidth:true,
viewrecords: true,
gridview: true,
loadonce:true,
jsonReader: {
repeatitems: false,
page: function() { return 1; },
root: "response"
},
subGrid: true,
// define the icons in subgrid
subGridOptions: {
"plusicon" : "ui-icon-triangle-1-e",
"minusicon" : "ui-icon-triangle-1-s",
"openicon" : "ui-icon-arrowreturn-1-e",
//expand all rows on load
"expandOnLoad" : false
},
subGridRowExpanded: function(subgrid_id, row_id) {
//console.info(subgrid_id+", "+row_id);
var subgrid_table_id, pager_id, iData = -1;
subgrid_table_id = subgrid_id+"_t";
//pager_id = "p_"+subgrid_table_id;
$("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' style='overflow-y:auto' class='scroll'></table><div id='"+pager_id+"' class='scroll'></div>");
$.each(comparePatchData.response,function(i,item){
if(item.id === row_id) {
iData = i;
return false;
}
});
if (iData == -1) {
return; // no data for the subgrid
}
jQuery("#"+subgrid_table_id).jqGrid({
datastr : comparePatchData.response[iData],
datatype: 'jsonstring',
colNames: ['Name','Value1','Value2','Value3'],
colModel: [
{name:"name",index:"name",width:90},
{name:"firstValue",index:"firstValue",width:100},
{name:"secondValue",index:"secondValue",width:100},
{name:"thirdValue",index:"thirdValue",width:100}
],
rowNum:10,
//pager: pager_id,
sortname: 'name',
sortorder: "asc",
height: 'auto',
autowidth:true,
jsonReader: {
repeatitems: false,
//page: function() { return 1; },
root: "attribute"
}
});
jQuery("#"+subgrid_table_id).jqGrid('navGrid',{edit:false,add:false,del:false});
}
});
grid.jqGrid('navGrid','#gridpager2',{add:false,edit:false,del:false});
grid.jqGrid('navButtonAdd','#gridpager2',{
caption:"Export to Excel",
onClickButton : function () {
jQuery("#list2").excelExport();
}
});
我的 Json 的一部分
{
"response": [
{
"id": "1",
"elementName": "libgtop2-devel-2.14.4-3.el5",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "libgtop2-devel-2.14.4-3.el5"
}
]
},
{
"id": "2",
"elementName": "ifd-egate-0.05-15",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "ifd-egate-0.05-15"
}
]
},
{
"id": "3",
"elementName": "libXScrnSaver-devel-1.1.0-3.1",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "libXScrnSaver-devel-1.1.0-3.1"
}
]
},
{
"id": "4",
"elementName": "kde-i18n-Chinese-Big5-3.5.4-1",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "kde-i18n-Chinese-Big5-3.5.4-1",
"secondValue": "kde-i18n-Chinese-Big5-3.5.4-1"
}
]
},
{
"id": "5",
"elementName": "cpio-2.6-20",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "cpio-2.6-20",
"secondValue": "cpio-2.6-20",
"thirdValue": "cpio-2.6-20"
}
]
},
{
"id": "6",
"elementName": "grep-2.5.1-54.2.el5",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "grep-2.5.1-54.2.el5",
"secondValue": "grep-2.5.1-54.2.el5",
"thirdValue": "grep-2.5.1-54.2.el5"
}
]
},
{
"id": "7",
"elementName": "avahi-compat-libdns_sd-0.6.16-1.el5",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "avahi-compat-libdns_sd-0.6.16-1.el5",
"secondValue": "avahi-compat-libdns_sd-0.6.16-1.el5",
"thirdValue": "avahi-compat-libdns_sd-0.6.16-1.el5"
}
]
},
{
"id": "8",
"elementName": "gpm-devel-1.20.1-74.1",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "gpm-devel-1.20.1-74.1",
"secondValue": "gpm-devel-1.20.1-74.1",
"thirdValue": "gpm-devel-1.20.1-74.1"
}
]
},
{
"id": "9",
"elementName": "esc-1.0.0-39.el5",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "esc-1.0.0-39.el5"
}
]
},
{
"id": "10",
"elementName": "kde-i18n-Spanish-3.5.4-1",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "kde-i18n-Spanish-3.5.4-1",
"secondValue": "kde-i18n-Spanish-3.5.4-1"
}
]
}
]
}
4 個解決方案
解決方案1
6 已采納 2011-07-19 07:37:07
您不必使用 Excel 格式導出文件即可將數據導入 Excel。 導出到CSV通常要容易得多。 默認情況下， CSV文件應與 Excel 相關聯，因此它應具有 Excel 圖標和所有內容。 我認為XML會以同樣的方式工作，但CSV格式要輕得多，並且在這種情況下做同樣的工作。 將JSON轉換為CSV很簡單：
var response = JSON.parse(responseJSON).response;
var csv = arrayToCSV(response);
function arrayToCSV(arr) {
var columnNames = [];
var rows = [];
for (var i=0, len=arr.length; i<len; i++) {
// Each obj represents a row in the table
var obj = arr[i];
// row will collect data from obj
var row = [];
for (var key in obj) {
// Don't iterate through prototype stuff
if (!obj.hasOwnProperty(key)) continue;
// Collect the column names only once
if (i === 0) columnNames.push(prepareValueForCSV(key));
// Collect the data
row.push(prepareValueForCSV(obj[key]));
}
// Push each row to the main collection as csv string
rows.push(row.join(','));
}
// Put the columnNames at the beginning of all the rows
rows.unshift(columnNames.join(','));
// Return the csv string
return rows.join('\n');
}
// This function allows us to have commas, line breaks, and double
// quotes in our value without breaking CSV format.
function prepareValueForCSV(val) {
val = '' + val;
// Escape quotes to avoid ending the value prematurely.
val = val.replace(/"/g, '""');
return '"' + val + '"';
}
解決方案2
0 2014-06-10 13:11:43
我有一個 jqGrid ，我在其中一次從服務器（java）以 JSON 格式獲取數據。 我希望將 jqGrid 中的數據導出為 Excel 格式。
這是一篇不錯的文章，向您展示如何從 jqGrid 導出到 Excel...
http://www.codeproject.com/Articles/784342/Export-data-from-jqGrid-into-a-real-Excel-file
解決方案3
0 2018-05-02 12:59:48
我這樣解決了這個問題：
- 讀
- 這是github
https://github.com/kayalshri/tableExport.jquery.plugin
- 這是一個演示
http://demos.w3lessons.info/jquery-table-export#
它完美地工作我嘗試了Export Excel 。 在我的例子中，我只是使用了 jqgrid 表的 id 選擇器。
順便說一句，這將只導出可見部分，所以如果你有 100 個頁面，它需要服務器端，因為信息不存在..
解決方案4
-2 2013-02-06 06:00:38
我正在使用 MOSS 2007 將一些列表（比如 5 個列表）導出到 excel。我的要求是我需要將多個列表導出到 excel。我在我的頁面中添加了一個帶有按鈕的 CEWP，以便單擊我可以將多個列表數據導出到 excel.nw 當我使用 jquery if( $('#WebPartWPQ3').is(':visible') )---> 對象預期錯誤時出現運行時錯誤。 我沒有找到任何 div id 來追蹤..所以有人知道答案嗎，請出來..與這個問題相關的 ans 真的非常感謝..我的代碼如下。
<button type="button"
onclick=exportToExcel();>Click<br>
</button><br>
<script type="text/javascript"><br>
function exportToExcel() <br>
{ <br>
alert('Hi');<br>
//alert($("#WebPartWPQ3").attr("visibility"));<br>
if( $('#WebPartWPQ3').is(':visible') )<br>
{ <br>
contentType = "application/vnd.ms-excel";<br>
var oExcel = new ActiveXObject("Excel.Application");<br>
var oBook = oExcel.Workbooks.Add;<br>
var oSheet = oBook.Worksheets(1);<br>
var VESSApplications =document.getElementById<br>('ctl00_m_g_e3f5d791_5651_40ca_a03a_1c511c7f2b28_ctl00_ctl00_toolBarTbl');<br>
alert(document.getElementById('WebPartWPQ3'));<br>
var OtherApplications =document.getElementById('tblOtherApplications');<br>
// var MFGApplications =document.getElementById('tblMFGApplications');<br>
var row=3;<br>
var col=1;<br>
//Define criteria - start<br>
oSheet.Cells(row, col)="Business Function";<br>
oSheet.Cells(row, col+1)="VESS";<br>
oSheet.Cells(row, col+2)=selectedVESSBusinessFunction;<br>
// oSheet.Cells(row, col+3)="Manufacturing";<br>
// if(selectedMFGBusinessFunction != "-Select-")<br>
// oSheet.Cells(row, col+4)=selectedMFGBusinessFunction;<br>
row +=2;<br>
oSheet.Cells(row, col)="Operating System";<br>
oSheet.Cells(row, col+1)="First Choice";<br>
if(selectedOperatingSystemFirstChoice != "-Select-")<br>
oSheet.Cells(row, col+2)=selectedOperatingSystemFirstChoice;<br>
oSheet.Cells(row, col+3)="Second Choice";<br>
if(selectedOperatingSystemSecondChoice != "-Select-")<br>
oSheet.Cells(row, col+4)=selectedOperatingSystemSecondChoice;<br>
row +=2;<br>
oSheet.Cells(row, col)="Platform";<br>
oSheet.Cells(row, col+1)="First Choice";<br>
oSheet.Cells(row, col+2)=selectedPlatformFirstChoice;<br>
oSheet.Cells(row, col+3)="Second Choice";<br>
if(selectedPlatformSecondChoice != "-Select-")<br>
oSheet.Cells(row, col+4)=selectedPlatformSecondChoice;<br>
row +=2;<br>
oSheet.Cells(row, col)="Delivery Method";<br>
oSheet.Cells(row, col+1)="First Choice";<br>
oSheet.Cells(row, col+2)=selectedDeliveryFirstChoice;<br>
oSheet.Cells(row, col+3)="Second Choice";<br>
if(selectedDeliverySecondChoice != "-Select-")<br>
oSheet.Cells(row, col+4)=selectedDeliverySecondChoice;<br>
row +=2;<br>
//alert(VESSApplications.rows.length);<br>
if(VESSApplications.rows.length>0)<br>
{<br>
for (var y = 0; y < VESSApplications.rows.length; y++) <br>
{<br>
for (var x = 0; x < VESSApplications .rows(y).cells.length; x++) <br>
{<br>
// oSheet.Cells(y + 1, x + 1) = VESSApplications .rows(y).cells(x).innerText;<br>
oSheet.Cells(row, x + 1) = VESSApplications .rows(y).cells(x).innerText;<br>
}<br>
row++;<br>
}<br>
// oExcel.Visible = true;<br>
// oExcel.UserControl = true;<br>
}<br>
else<br>
{<br>
alert("There is no VESS/Other Applications to Export!");<br>
}<br>
row +=2;<br>
//Other Applications<br>
/* for (var y = 0; y < OtherApplications.rows.length; y++) <br>
{<br>
for (var x = 0; x < OtherApplications.rows(y).cells.length; x++) <br>
{<br>
oSheet.Cells(row, x + 1) = OtherApplications.rows(y).cells(x).innerText;<br>
}<br>
row++;<br>
}<br>
row +=2;<br>
//MFG Applications<br>
for (var y = 0; y < MFGApplications.rows.length; y++) <br>
{<br>
for (var x = 0; x < MFGApplications.rows(y).cells.length; x++) <br>
{<br>
// oSheet.Cells(y + 1, x + 1) = VESSApplications .rows(y).cells(x).innerText;<br>
oSheet.Cells(row, x + 1) = MFGApplications.rows(y).cells(x).innerText;<br>
}<br>
row++;<br>
}<br>
*/
oSheet.columns.autofit;<br>
oExcel.Visible = true;<br>
oExcel.UserControl = true;<br>
}<br>
else<br>
{<br>
alert('No VESS/Other applications available to export');<br>
}<br>
}<br>
在復選框選擇上將jqgrid數據導出到excel
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.