Search code examples
javascriptexceldatatablesexport

export to excel using datatable


I want to export to excel. here is my code.

$('#tabelku').dataTable({
                        
                        dom: 'Bfrtip',
                        "buttons": [{
                            extend: 'excel',
                            text: 'Excel'
                            
                            }
                        ],
                        dom: '<"row"<"col-lg-6"l><"col-lg-6"f>><"table-responsive"t>p',
                        "aLengthMenu": [
                            [10, 20, 30, 40, -1],
                            [10, 20, 30, 40, "All"] // change per page values here
                        ],
                        
                        "bProcessing": true,
                        "bServerSide": true,
                        "sServerMethod": "POST",
                        "bRetrieve": true,
                        "sAjaxSource": "<?= site_url() ?>monev/do_Tabel_Universitas",
                        // set the initial value
                        "iDisplayLength": 10,
                        "oLanguage": {
                            "sProcessing": '<i class="fa fa-coffee"></i>&nbsp;Please wait...',
                            "sLengthMenu": "_MENU_ records",
                            "oPaginate": {
                                "sPrevious": "Prev",
                                "sNext": "Next"
                            }
                        },
                        "aoColumnDefs": [{
                                'bSortable': false,
                                'aTargets': [0, 8]
                            }
                        ],
                        
                    });

the button Excel already shows but the problem is dropdown contains 10, 20, 30, 40 records is missing.. before I add this code

dom: 'Bfrtip',
                        "buttons": [{
                            extend: 'excel',
                            text: 'Excel'
                            
                            }
                        ],

the dropdown 10, 20, 30, 40 can show.. any code that I missing ??


Solution

  • You've specified the dom option twice, and since you're not seeing the length dropdown it seems to be using the first one (since that one doesn't have a l in it, which makes it show the length dropdown).

                            dom: 'Bfrtip',
                            "buttons": [{
                                extend: 'excel',
                                text: 'Excel'
                                
                                }
                            ],
                            dom: '<"row"<"col-lg-6"l><"col-lg-6"f>><"table-responsive"t>p',
                            "aLengthMenu": [
                                [10, 20, 30, 40, -1],
                                [10, 20, 30, 40, "All"] // change per page values here
                            ],
    

    To show both the buttons and the length dropdown, remove one of your dom options, and make sure the one that you're using has both the B (for the Buttons) and the l in it, e.g.:

    dom: '<"row"<"col-lg-6"Bl><"col-lg-6"f>><"table-responsive"t>p',
    

    More info here: https://datatables.net/reference/option/dom