将jqgrid导出到excel中并不适用于jsp
大家好!! 我有一个jqgrid显示logging。现在根据我的要求,我必须将其导出为Excel格式。我试图做到这一点,但没有发生任何how.Export到Excelbutton不工作。在这里我发布我的代码…
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JQgrid</title> <img src="images/header.png" alt="Logo" height="130" width="1270"/> <hr noshade size="3" align="left"> <script language="javaScript" type="text/javascript" src="calender.js"></script> <link href="calender.css" rel="stylesheet" type="text/css"> <link href="css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" /> <link href="css/ui.jqgrid.css" rel="stylesheet" type="text/css" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <link href="plugins/ui.multiselect.css" rel="stylesheet" type="text/css" /> <script src="js/jquery-1.5.2.min.js" type="text/javascript"></script> <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script> <script src="js/jquery-ui-custom.min.js" type="text/javascript"></script> <script src="plugins/ui.multiselect.js" type="text/javascript"></script> <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script> <script src="js/custom.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { //var windowWidth = (document.documentElement.clientWidth - 100) /0.9; var i=1; $('#go').click(function(evt){ //alert('hi'); evt.preventDefault(); var todate=$('#todate').val(); var fromdate=$('#todate').val(); if(todate && fromdate) { var URL='getGriddahico.jsp?todate='+$('#todate').val()+'&fromdate='+$('#fromdate').val(); //jQuery("#gridUsuarios").jqGrid('reload'); if(i==1){gridcall(URL);} else{jQuery("#gridUsuarios").jqGrid('GridUnload');gridcall(URL);} i++; } }); }); function gridcall(path) { jQuery("#gridUsuarios").jqGrid({ url:path, datatype: "json", colNames:['ID','Call Date','src','dst','dstchannel','Lastapp','Duration','Disposition','Amaflags','cdrcost'], colModel:[ {name:'id',index:'id', width:90,align: 'center',editable:true, hidden:true,closed:true}, {name:'calldate',index:'calldate',editable:false, width:170,align: 'center'}, {name:'src',index:'src',editable:false, width:170,align: 'center'}, {name:'dst',index:'dst',editable:false, width:170,align: 'center'}, {name:'dstchannel',index:'dstchannel',editable:false, width:170,align: 'center'}, {name:'Lastapp',index:'lastapp',editable:false, width:170,align: 'center'}, {name:'duration',index:'duration',editable:false, width:170,align: 'center'}, {name:'disposition',index:'disposition',editable:false, width:170,align: 'center'}, {name:'amaflags',index:'amaflags',editable:false, width:170,align: 'center'}, {name:'cdrcost',index:'cdrcost',editable:false, width:170,align: 'center'}, ], rowNum:50, rowList:[50,100,150], scrollrows : true, // multiselect: true, pager: '#pagGrid', sortname: 'id', viewrecords: true, sortorder: "asc", autowidth:true, //width: windowWidth, height:360, editurl:'edit.jsp' }); $("#gridUsuarios").jqGrid('navGrid', '#pagGrid',{excel:true}) .navButtonAdd('#pagGrid',{ caption:"Export to Excel", buttonicon:"ui-icon-save", onClickButton: function(){ exportExcel(); }, position:"last" }); function exportExcel() { var mya=new Array(); mya=$("#gridUsuarios").getDataIDs(); // Get All IDs var data=$("#gridUsuarios").getRowData(mya[0]); // Get First row to get the labels var colNames=new Array(); var ii=0; for (var i in data){colNames[ii++]=i;} // capture col names var html=""; for(i=0;i<mya.length;i++) { data=$("#gridUsuarios").getRowData(mya[i]); // get each row for(j=0;j<colNames.length;j++) { html=html+data[colNames[j]]+"\t"; // output each column as tab delimited } html=html+"\n"; // output each row with end of line } html=html+"\n"; // end of line at the end document.forms[0].csvBuffer.value=html; document.forms[0].method='POST'; document.forms[0].action='csvExport.jsp'; // send it to server which will open this contents in excel file document.forms[0].target='_blank'; document.forms[0].submit(); } jQuery("#gridUsuarios").jqGrid('bindKeys', {"onEnter":function( rowid ) { alert("You enter a row with id:"+rowid)} } ); } </script>
我在您的解决scheme中看到一些devise问题。 我只会试着描述你所做的事情:
- 您有保存在服务器上的数据。 可能将数据保存在数据库中。
- 您可以使用每个Ajax请求从服务器返回的数据填充jqGrid。
- 如果用户单击“导出到Excel”button,则尝试从网格的当前页面的单元格中读取数据,并通过HTTP POST将数据发送到服务器。 您希望服务器(
csvExport.jsp
)将生成一些Excel文件并将数据返回给客户端。
你能解释一下为什么你需要将数据从jqGrid发送到服务器? 服务器已经有了所有的数据,服务器已经为你准备好了数据。 ( $('#todate').val()
和$('#fromdate').val()
)向服务器发送请求并不容易,服务器将获得所有的数据直接来自数据库?
顺便说一句,你在你的代码中input错误: var fromdate=$('#todate').val();
。 你的意思可能是var fromdate=$('#fromdate').val()
?
关于服务器端代码的执行请看这里 。 我不确定它是否会对您有所帮助,但在另一个我之前发布的代码中,这个代码展示了如何使用Open XML SDK 2.0在服务器代码中生成真正的Excel文件(.XLSX文件)。