JQGrid 내에 있는 모든 컬럼들 ( 보이지 않는 컬럼들 포함 ) 을 그대로 엑셀 출력하기 위한 기능이다
JQGrid 에 버튼을 추가하고 버튼 클릭시 엑셀파일로 저장할 수 있도록 기능 추가를 해보도록 하자
우선 JQGrid 에서 저장버튼을 추가한다.
|
$("#jqgridname").jqGrid('navButtonAdd', div_id, {
id:'pager_excel',
caption:'',
title:'엑셀 다운',
onClickButton : function(e) {
exportExcel ( $("#jqgridname"), "test.xls" );
}, buttonicon:'ui-icon-arrowthickstop-1-s'
}); |
위와 같이 아이콘을 추가했다면, JQGrid 아래에 툴팁으로 엑셀다운이라는 버튼이 추가가 될것이다.
이제 ExportExcel 이라는 파일을 구현해보도록 하자
|
export_excel.jsp |
|
<script type="text/javascript">
//excel로 출력
function exportExcel ( pGridObj, pFileName ) {
var mya = pGridObj.getDataIDs();
var data = pGridObj.getRowData(mya[0]);
var colNames=new Array();
var ii=0;
for (var d in data){ colNames[ii++] = d; }
//컬럼 헤더 가져오기
var columnHeader = pGridObj.jqGrid('getGridParam','colNames') + '';
var arrHeader = columnHeader.split(',');
var html="<table border=1><tr>";
for ( var y = 1; y < arrHeader.length; y++ ) {
html = html + "<td><b>" + encodeURIComponent(arrHeader[y]) + "</b></td>";
}
html = html + "</tr>";
//값 불러오기
for(var i=0;i< mya.length;i++) {
var datac= pGridObj.getRowData(mya[i]);
html = html +"<tr>";
for(var j=0; j< colNames.length;j++) html=html + '<td>' + encodeURIComponent(datac[colNames[j]])+"</td>";
html = html+"</tr>";
}
html=html+"</table>"; // end of line at the end
document.EXCEL_.csvBuffer.value = html;
document.EXCEL_.fileName.value = encodeURIComponent(pFileName);
document.EXCEL_.target='_new';
document.EXCEL_.submit();
}
</script>
<form id="EXCEL_" name="EXCEL_" action="down_excel.jsp" method="post">
<input type="hidden" name="csvBuffer" id="csvBuffer" value="">
<input type="hidden" name="fileName" id="fileName" value="">
</form> |
JQGrid에서 제공하는 JQGrid 질의 함수를 통해 ColNames 를 모두 받아온다.
이때 반환되는 데이터는 , 로 나누어져 있기 때문에 잘라내서 엑셀 첫번째 줄에 세팅해준다.
테이블로 내용을 작성하여 폼의 hidden으로 데이터를 넘긴다.
excel_down.jsp 에서 파일을 다운받을 수 있도록 폼 서브밋을 실행한다
|
down_excel.jsp |
|
<%@ page import="java.net.URLDecoder, java.net.URLEncoder" %>
<%
try {
String docName = "";
String data = request.getParameter("csvBuffer");
String fileName = request.getParameter("fileName");
//헤더 선택
String header = request.getHeader("User-Agent");
if (header.contains("MSIE")) { header = "MSIE"; }
else if(header.contains("Chrome")) { header = "Chrome"; }
else if(header.contains("Opera")) { header = "Opera"; }
if (data != null && fileName != null ) {
data = URLDecoder.decode(data, "UTF-8");
fileName = URLDecoder.decode(fileName, "UTF-8");
response.setContentType("application/vnd.ms-excel");
if (header.contains("MSIE")) {
docName = URLEncoder.encode(fileName,"UTF-8").replaceAll("\\+", "%20");
response.setHeader("Content-Disposition", "attachment;filename=" + docName + ".xls;");
} else if (header.contains("Firefox")) {
docName = new String(fileName.getBytes("UTF-8"), "ISO-8859-1");
response.setHeader("Content-Disposition", "attachment; filename=\"" + docName + ".xls\"");
} else if (header.contains("Opera")) {
docName = new String(fileName.getBytes("UTF-8"), "ISO-8859-1");
response.setHeader("Content-Disposition", "attachment; filename=\"" + docName + ".xls\"");
} else if (header.contains("Chrome")) {
docName = new String(fileName.getBytes("UTF-8"), "ISO-8859-1");
response.setHeader("Content-Disposition", "attachment; filename=\"" + docName + ".xls\"");
}
response.setHeader("Pragma", "no-cache;");
response.setHeader("Expires", "-1;");
out.println(data);
}//end of if
} catch ( Exception e ) {
e.printStackTrace();
out.println(e.toString());
}
%> |
브라우져 마다의 옵션이 틀리기 때문에, response의 헤더만 변경해주고 엑셀파일을 출력하도록 처리하였다
