abhisheksimion
asked on
export to excel in jquery or jqGrid
I have a jqGrid where I get data at once from server (java) in JSON format. I want the data in the jqGrid to be exported into Excel format.
Till now I saw this page which gives me an error in IE 'o.url is null or not an object' grid.import.js
Also I saw this demo where on the tool tip of export button it says Export To Excel but the file saved is in xml format.
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.
Till now I saw this page which gives me an error in IE 'o.url is null or not an object' grid.import.js
Also I saw this demo where on the tool tip of export button it says Export To Excel but the file saved is in xml format.
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.
http://www.highoncoding.com/Articles/566_JQuery_jqGrid_Export_to_Excel_Using_ASP_NET_MVC_Framework.aspx
ASKER
My code
grid = jQuery("#list2");
grid.jqGrid({
datastr : comparePatchData,
datatype: 'jsonstring',
colNames:['Name',starheade r, header1, header2],
colModel:[
{name:'elementName',index: 'elementNa me', width:90},
{name:'isPrasentinXml1',in dex:'isPra sentinXml1 ', width:100, align:'center', formatter: patchPresent},
{name:'isPrasentinXml2',in dex:'isPra sentinXml2 ', width:100, align:'center', formatter: patchPresent},
{name:'isPrasentinXml3',in dex:'isPra sentinXml3 ', 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("<t able id='"+subgrid_table_id+"' style='overflow-y:auto' class='scroll'></table><di v id='"+pager_id+"' class='scroll'></div>");
$.each(comparePatchData.re sponse,fun ction(i,it em){
if(item.id === row_id) {
iData = i;
return false;
}
});
if (iData == -1) {
return; // no data for the subgrid
}
jQuery("#"+subgrid_table_i d).jqGrid( {
datastr : comparePatchData.response[ iData],
datatype: 'jsonstring',
colNames: ['Name','Value1','Value2', 'Value3'],
colModel: [
{name:"name",index:"name", width:90},
{name:"firstValue",index:" firstValue ",width:10 0},
{name:"secondValue",index: "secondVal ue",width: 100},
{name:"thirdValue",index:" thirdValue ",width:10 0}
],
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_i d).jqGrid( 'navGrid', {edit:fals e,add:fals e,del:fals e});
}
});
grid.jqGrid('navGrid','#gr idpager2', {add:false ,edit:fals e,del:fals e});
grid.jqGrid('navButtonAdd' ,'#gridpag er2',{
caption:"Export to Excel",
onClickButton : function () {
jQuery("#list2").excelExpo rt();
}
});
My Json
{
"response": [
{
"id": "1",
"elementName": "libgtop2-devel-2.14.4-3.e l5",
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "libgtop2-devel-2.14.4-3.e l5"
}
]
},
{
"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"
}
]
}
]
}
@minhvc: I have already used your 2nd comment (View my links (2nd link) in question) and came up with my jqgrid, see below a screenshot, please suggest some other alternative, i am also posting my code and json string. thanks for your reply
grid = jQuery("#list2");
grid.jqGrid({
datastr : comparePatchData,
datatype: 'jsonstring',
colNames:['Name',starheade
colModel:[
{name:'elementName',index:
{name:'isPrasentinXml1',in
{name:'isPrasentinXml2',in
{name:'isPrasentinXml3',in
],
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+
var subgrid_table_id, pager_id, iData = -1;
subgrid_table_id = subgrid_id+"_t";
//pager_id = "p_"+subgrid_table_id;
$("#"+subgrid_id).html("<t
$.each(comparePatchData.re
if(item.id === row_id) {
iData = i;
return false;
}
});
if (iData == -1) {
return; // no data for the subgrid
}
jQuery("#"+subgrid_table_i
datastr : comparePatchData.response[
datatype: 'jsonstring',
colNames: ['Name','Value1','Value2',
colModel: [
{name:"name",index:"name",
{name:"firstValue",index:"
{name:"secondValue",index:
{name:"thirdValue",index:"
],
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_i
}
});
grid.jqGrid('navGrid','#gr
grid.jqGrid('navButtonAdd'
caption:"Export to Excel",
onClickButton : function () {
jQuery("#list2").excelExpo
}
});
My Json
{
"response": [
{
"id": "1",
"elementName": "libgtop2-devel-2.14.4-3.e
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "libgtop2-devel-2.14.4-3.e
}
]
},
{
"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
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": false,
"isPrasentinXml2": false,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"thirdValue": "libXScrnSaver-devel-1.1.0
}
]
},
{
"id": "4",
"elementName": "kde-i18n-Chinese-Big5-3.5
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "kde-i18n-Chinese-Big5-3.5
"secondValue": "kde-i18n-Chinese-Big5-3.5
}
]
},
{
"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.
"subCategory": "patch",
"isEqual": false,
"isPrasentinXml1": true,
"isPrasentinXml2": true,
"isPrasentinXml3": true,
"attribute": [
{
"name": "name",
"firstValue": "avahi-compat-libdns_sd-0.
"secondValue": "avahi-compat-libdns_sd-0.
"thirdValue": "avahi-compat-libdns_sd-0.
}
]
},
{
"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"
}
]
}
]
}
@minhvc: I have already used your 2nd comment (View my links (2nd link) in question) and came up with my jqgrid, see below a screenshot, please suggest some other alternative, i am also posting my code and json string. thanks for your reply
ASKER
@minhvc: the 3rd comment that you posted from stackoverflow, is my question is stackoverflow.. Lol I want an alternate suggestion from the client side
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.