[JAVASCRIPT] 테이블의 원하는 필드(항목)만 엑셀로 내보내기

https://mongs-drawing.tistory.com/12

이미 생성되어 있는 테이블을 엑셀로 내보내는 방법은 위에서 포스팅 한 것과 같이 쉽게 할 수 있다.

하지만 생성되어 있는 테이블이 버튼등의 이벤트 처리를 위한 항목들이 포함되어 있을 때는 위의 방법을 사용하면 엑셀이 지저분하게 생성되게 된다.

테이블의 원하는 항목만 엑셀로 저장하는 방법 또한 구글에서 검색을 하면 찾을 수는 있지만 테이블 전체를 저장하는 거에 비해서는 상당히 복잡하다.(엑셀 자체 api를 이용하거나 커스터마이징하여 직접 개발을 해야 한다.) 

보다 쉽게 원하는 항목만 뽑아내기 위해서는 테이블을 만들 때 필요한 항목만 JSON 배열화 하여 저장하면 된다.

 

---

테이블이 있는 페이지

 html 

<button id="exportExcel">내보내기</button>

 

---

 

JSON데이터를 엑셀로 추출하는 소스

 JAVASCRIPT 

$(document).ready(function(){
	DataList(); // 이벤트 발생 시 데이터를 넣도록 수정하면 실제 서비스상에서 사용하기 편하다.
}
// 배열 생성
var DataJson = []; // 배열 초기화
function DataList(){
    DataJson.push(["순서", "회사명", "모델명", "우선순위"]);
    DataJson.push(["1", "현대", "그랜져", "1"]);
    DataJson.push(["2", "기아", "K8", "1"]);
    DataJson.push(["3", "현대", "G70", "2"]);
    DataJson.push(["4", "쌍용", "토레스", "1"]);
}
   
// 엑셀 파일명에 오늘 날짜를 추가해 주는 위해 날짜 변수 생성
var today = new Date();
var year = today.getFullYear();
var month = ('0' + (today.getMonth() + 1)).slice(-2);
var day = ('0' + today.getDate()).slice(-2);
var dateString = year + month + day;

function exportExcel(status){
    var wb = XLSX.utils.book_new();
    wb.SheetNames.push("sheet 1");
    var wsData = DataJson;
    var ws = XLSX.utils.aoa_to_sheet(wsData);
    wb.Sheets["sheet 1"] = ws;
    var wbout = XLSX.write(wb, {bookType:'xlsx', type: 'binary'});
    saveAs(new Blob([s2ab(wbout)],{type:"application/octet-stream"}), '엑셀_다운로드.xlsx');
}

function s2ab(s) { 
    var buf = new ArrayBuffer(s.length); //convert s to arrayBuffer
    var view = new Uint8Array(buf);  //create uint8array as viewer
    for (var i=0; i<s.length; i++) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;    
}