특정 영역 excel export

원하는 특정 영역 (ex. <div>) 만 excel 로 export 하고 싶을 때

action 에서 해당 내용을 다시 select 하여 결과 jsp 에서 excel 의 내용을 다시 그려주곤 했다.

하지만 아래와 같은 방법으로도 가능 하다.

 

1. IE

excel 로 그려주고 싶은 부분을 <div> 로 묶는다.  아래 소스에서는 target_tb

target table 의 html 을 action 으로 submit();

excel jsp 에서는 해당 html tag 를 받아서 그려주기만 하면 된다.

- jsp & javascript

.. <div id="target_tb">    <table>....</table> </div> <iframe id="xlsFrame" name="xlsFrame" style="width: 0px; height: 0px; border: 0px;"></iframe> <form id="excelForm" name="excelForm" method="post" target="xlsFrame" action=""> <input type="hidden" id="excelSource" name="excelSource"> </form> ..   ... document.excelForm.action = getContextRoot() + 'project/toExcel.do'; $('#excelSource').val($('#test_tb').html()); document.excelForm.submit(); ...

 

- Action class

@RequestMapping(value = "toExcel.do") public String toExcel(HttpServletRequest req) { String excelSource = req.getParameter("excelSource"); String endUser = req.getParameter("endUser"); try { excelSource = new String(excelSource.getBytes("iso-8859-1"), "UTF-8"); endUser = new String(endUser.getBytes("iso-8859-1"), "UTF-8"); } catch (UnsupportedEncodingException e) { e.printStackTrace(); } req.setAttribute("excelSource", excelSource); return "/toExcel";   }

 

- excel jsp

<%@ page contentType="application/vnd.ms-excel;charset=UTF-8" pageEncoding="UTF-8"%> <% response.setHeader("Content-Type", "application/vnd.ms-excel"); response.setHeader("Content-Disposition", "attachment; filename=test.xls); response.setHeader("Content-Description", "JSP Generated Data"); %> ${excelSource}

 

 

2. NO IE

IE 가 아닌 경우 더 간단하다. Action class 를 거치지 않아도 된다.

window.open('data:application/vnd.ms-excel,filename="test.xls",' + encodeURIComponent($('#test_tb').html()), '_blank'); e.preventDefault();