취업/PHP

[php] datatable export button not showing

카슈밀 2021. 11. 30. 14:01
반응형

JS 파일안에서 사용시 말 그대로 버튼이 출력되지 않는 문제...

 

원인은 제이쿼리를 쓰면 $document.ready(function() {});을 쓰는데, 이게 감싸있다보니 그런 것.

해당 부분을 제거하면 된다.

<table class="table table-bordered table-striped " id="userhistoryTable" style="max-width: 1791px;">
  <thead>
    <tr>
      <th scope="col" style="width:5%;">type</th>
      <th scope="col" style="width:10%;">price</th>
      <th scope="col" style="width:10%;">quantity</th>
      <th scope="col" style="width:10%;">time</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script> 
<script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script> 
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/dataTables.buttons.min.js"></script> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.html5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.print.min.js"></script>

 

let data = {
        symbol: 'coke'
    };
$('#userhistoryTable').DataTable({
        order: [ [ 3, "DEC" ] ],
        destroy: true,
        dom: 'Blfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ],
        ajax: {
            url: 'curl',
            type: 'GET',
            data : data,
            dataSrc: '',
            error: function (e) {
                errorHandler(e);
            }
        },
        columns: [
            {data: "type"},
            {data: "price"},
            {data: "quantity"},
            {
                data: "time", 
                render: function(time) {
                    return moment(time).format('YYYY-MM-DD HH:mm');
                }
            }
        ]
    });

어쩐지 왜 jsfiddle은 작동되는데, 서버에선 안되나 했다.

728x90