How to put two functions together

Mónica García

Hello. I am working with DataTables and I have two functions, but I am not sure how to use them together.

This is the first one to use language function:

$(document).ready(function() {
     var table = $('#mitabla').DataTable({
    
           "order": [[2, "asc"]],
                "language":{
                "Info":  "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                 "LengthMenu":     "Mostrar _MENU_ registros",
                "infoEmpty": "No hay registros disponibles",
                "infoFiltered": "(filtrada de _MAX_ registros)",
                "loadingRecords": "Cargando...",
                "processing":     "Procesando...",
                "search": "Buscar:",
                "InfoThousands":  ",",
                "zeroRecords":    "No se encontraron registros coincidentes",
                "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json",
                 "serverSide": true,
                "ajax": "server/serverpedpen.php",
                "paginate": {
                        "First":    "Primero",
                        "Last":     "Último",
                        "Next":     "Siguiente",
                        "Previous": "Anterior"
                },
                 "scrollX": true,
            }
        });

This is the second one, for Individual column searching (select inputs)

$(document).ready(function() {
    $('#mitabla').DataTable( {
        initComplete: function () {
            this.api().columns([0,1,2,3,4,5,6]).every( function () {
                var column = this;
                var select = $('<select><option value=""></option></select>')
                   .appendTo( $(column.header()) )
                    .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>' )
                } );
            } );
        }

Could you please advice in how to put them together? Thank you in advance

Edited by Kevin:  Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

kthorngren

The first problem is you have the "scrollX": true, option inside the language option. Each initialization option needs to be separated by commas. What you have would look like this:

$(document).ready( function () {
     var table = $('#mitabla').DataTable({
     
           "order": [[2, "asc"]],
           "language":{
                "Info":  "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                 "LengthMenu":     "Mostrar _MENU_ registros",
                "infoEmpty": "No hay registros disponibles",
                "infoFiltered": "(filtrada de _MAX_ registros)",
                "loadingRecords": "Cargando...",
                "processing":     "Procesando...",
                "search": "Buscar:",
                "InfoThousands":  ",",
                "zeroRecords":    "No se encontraron registros coincidentes",
                "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json",
                 "serverSide": true,
                "ajax": "server/serverpedpen.php",
                "paginate": {
                        "First":    "Primero",
                        "Last":     "Último",
                        "Next":     "Siguiente",
                        "Previous": "Anterior"
                },
            },
            "scrollX": true,
            initComplete: function () {
                this.api().columns([0,1,2,3,4,5,6]).every( function () {
                var column = this;
                var select = $('<select><option value=""></option></select>')
                   .appendTo( $(column.header()) )
                    .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