Dropdown list select excel export column width problem

Dropdown list select excel export column width problem

ghostrider999ghostrider999 Posts: 1Questions: 0Answers: 0
edited October 2016 in Free community support

I have used an example to build a dropdown select on my table but when I use that in combination with the Excel export button, the excel file opens but the widths of the columns are all set to the maximum (255) so you have to go and reset the column widths in Excel which is pain. I then removed the footer code with the selects and the widths work fine when exporting to excel. Here is my code for the Javascript Init. The footer: false option has no effect. I have tried to bind a mousedown event and remove the footer html before the file is generated using JQuery but it did not work.

    var table = $('#dynamic-table').dataTable( {
        colReorder: true,
        select: {
            style: 'single'
        },
        dom: 'Bfrtlip',
        buttons: [
                  {
                      extend: 'excel',
                      footer: false                   
                  },                  
                  'copy', 'csv', 'print', 'colvis'
        ],      
        initComplete: function () {
            this.api().columns().every( function () {
                var column = this;
                var select = $('<select><option value=""></option></select>')
                    .appendTo( $(column.footer()).empty() )
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );
 
                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } );
 
                column.data().unique().sort().each( function ( d, j ) {
                    select.append( '<option value="'+d+'" style="max-width: 180px;">'+d+'</option>' )
                } );
            } );
            
        }       
    }); 

My footer code is (I left the columns blank)

                                <tfoot class="thefooter">
                                    <tr>
                                        <td></td>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                    </tr>
                                </tfoot>
This discussion has been closed.