[그누보드] PHP, JS 테이블을 엑셀로 다운받기(xlsx) (Jquery 충돌에러 해결법 추가)

 

https://jasontody.tistory.com/227

[그누보드] 테이블을 엑셀로 다운받기

 

는 xlx 만 가능했는데 xlxs가 필요해서 작업함.

 

1. 버튼 추가

<button type="button" class="btn" value="excel 다운" onclick="ReportToExcelConverter()">

 

2. 관련함수 추가

<script src="../tableExport.min.js"></script>
<script src="../libs/FileSaver/FileSaver.min.js"></script>
<script src="../libs/js-xlsx/xlsx.core.min.js"></script>
<script src="../libs/html2canvas/html2canvas.min.js"></script>

관련함수 다운로드 : https://www.npmjs.com/package/tableexport.jquery.plugin

tableExport.jquery.plugin-master.zip

8.80MB

아래 파일은 필요한것만 받은 파일.

Libs Custom.zip

8.60MB / 8.60MB

3. 자바스크립트 함수 추가

  function ReportToExcelConverter() { 
    $('#table2excel').tableExport(
        {
            type:'excel', 
            mso: {
                fileFormat:'xlsx',
                worksheetName : 'List'
            }

        }
    );
  };

 

 

------

2023.03.31. 

기존 그누보드 버전이 

1.12.4 가 head.sub 파일과 tail.sub 에 각각 추가되어 있었다.

 

개발자모드 콘솔에 tableExport is not a function 오류가 계속 뜨길래

jquery 버전문제로 판단되어 해결해보았다. 

 

tail.sub script 코드에는 주석처리를 해주고, 

엑셀다운버튼이 있는 list.skin.php 파일에 하단부분에

아래 코드를 추가해주었더니 해결되었다.

 

<?php
add_javascript('<script src="https://code.jquery.com/jquery-3.6.4.js" integrity="sha256-a9jBBRygX1Bh5lt8GZjXDzyOB+bWve9EiO7tROUtj/E=" crossorigin="anonymous"></script>', 0);
?>

순서는 아래와 같다.

 

<script src="<?php echo G5_THEME_URL ?>/skin/board/register_musitec/libs/FileSaver/FileSaver.min.js"></script>
<script src="<?php echo G5_THEME_URL ?>/skin/board/register_musitec/libs/js-xlsx/xlsx.core.min.js"></script>
<script src="<?php echo G5_THEME_URL ?>/skin/board/register_musitec/libs/html2canvas/html2canvas.min.js"></script>
<script src="<?php echo G5_THEME_URL ?>/skin/board/register_musitec/tableExport.min.js"></script>




<?php

add_javascript('<script src="https://code.jquery.com/jquery-3.6.4.js" integrity="sha256-a9jBBRygX1Bh5lt8GZjXDzyOB+bWve9EiO7tROUtj/E=" crossorigin="anonymous"></script>', 0);


?>

<script>
	  function ReportToExcelConverter() { 
    $('#table2excel').tableExport(
        {
            type:'excel', 
            mso: {
                fileFormat:'xlsx',
                worksheetName : 'List'
            }

        }
    );
  };
</script>