데이터 테이블에서 Excel 내보내기

8808 단어 DataTables
HTML
<!-- data tables -->
<table id="tbl_data" class="display"></table>
Excel 내보내기 라이브러리
<!-- Excel Export -- -->
<link href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css" rel="stylesheet">
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.2/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/1.6.2/js/buttons.html5.min.js"></script>
<!-- -- Excel Export -->
데이터 준비
var data = {value:[
    {id:"1",text:"This is test"},
    {id:"2",text:"This is test"},
    {id:"3",text:"This is test"},
]};
데이터 세트
// data for datatables
var dt_data = new Array();

dt_data = data["value"];

if($.fn.dataTable.isDataTable("#tbl_data")){
    $("#tbl_data").dataTable().fnDestroy();
}

$('#tbl_data')
.css("font-size","10pt")
// .addClass("nowrap")
.dataTable({
    "data": dt_data,
    "dom" : '<flipt><B>', // https://datatables.net/examples/basic_init/dom.html
    "oLanguage": {
        "sSearch": "Table Filter:"
    },
    // Export options
    // https://datatables.net/extensions/buttons/examples/html5/simple.html
    "buttons": [
        {
            extend: 'excel',
            text: 'Export as Excel File',
            exportOptions:{
                columns: [ 0, 1 ],
            }
        }
    ],
    "columns": [
        { "title":"ID", "data": "id" }, 
        { "title":"Text", "data": "text" }, 
    ]
    });

table = $('#tbl_data').DataTable();
return;
결실

좋은 웹페이지 즐겨찾기