How to combine 2 Javascript codes for DataTables

harzio

Hi,
I am a newbie in programming. I start learning ASP Classic to display some data from MS SQL Server database. I really love the features of DataTables. It has most everything that I need. But lack of programming knowledge make me sometime not fully understand how to write the code.

I want to combine 2 JavaScript codes below:
First code:
Source code: https://datatables.net/examples/api/multi_filter_select.html

$(document).ready(function() {
    $('#example').DataTable( {
        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+'">'+d+'</option>' )
                } );
            } );
        }
    } );
} );

And second code:

<script> 
            $(document).ready(function() {
                $('#example').DataTable({
                    "lengthMenu": [ 50 ],
                    "lengthChange": false,
                    dom: 'Bfrtip',
                    buttons: [
                        'excel', 'pdf', 'print'
                    ]
                });
            } );
        </script>

I want to add the 2nd code into the 1st code above. Please help how to do it.

Thanks

kthorngren

Each configuration option is separated by commas and the order doesn't matter. You can simply combine the two making sure to comma separate the options. For example:

            $(document).ready(function() {
                $('#example').DataTable({
                    "lengthMenu": [ 50 ],
                    "lengthChange": false,
                    dom: 'Bfrtip',
                    buttons: [
                        'excel', 'pdf', 'print'
                    ],   //added comma here

                    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+'">'+d+'</option>' )
                            } );
                        } );
                    }
                });
            } );

Kevin

harzio

Thanks very much, Kevin.
The JavaScript works.