Jquery datatable progressive

Link:
para hacer tabla progresiva

Datatable jquery con busqueda en el footer y sin el buscar superior

Suele suceder que si se le da "bFilter": false , es cierto que se quita pero resulta que queremos que siga funcionando la busqueda en el footer de la tabla.

Este es un ejemplo:





 <table id="tblDatos" class="display" cellspacing="0">
        <thead>
            <tr>
                <th width="20%">Código</th>
                <th width="50%">Agrupación</th>
                <th width="15%" class="no-sort"></th>

            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Código</th>
                <th>Agrupación</th>
                <th></th>
            </tr>
        </tfoot>
        <tbody>
            <tr id="1">
                <td>1</td>
                <td>Pares de </td>
                <td>
                    <button type="button" class="btn btn-default">
                        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                    </button>

                    <button type="button" class="btn btn-danger">
                        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                    </button>
                </td>


            </tr>
            <tr id="2">
                <td>2</td>
                <td>Central grupal</td>
                <td>
                    <button type="button" class="btn btn-default">
                        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                    </button>

                    <button type="button" class="btn btn-danger">
                        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                    </button>
                </td>
            </tr>
            <tr id="3">
                <td>3</td>
                <td>Zonas magistrales</td>
                <td>
                    <button type="button" class="btn btn-default">
                        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                    </button>

                    <button type="button" class="btn btn-danger">
                        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                    </button>
                </td>
            </tr>
            @*<tr id="4">
                <td>5</td>
                <td>Nivel 5</td>
                <td>
                    <button type="button" class="btn btn-default">
                        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                    </button>

                    <button type="button" class="btn btn-danger">
                        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                    </button>
                </td>
            </tr>*@
            <tr id="6">
                <td>6</td>
                <td>Nivel 6</td>
                <td>
                    <button type="button" class="btn btn-default">
                        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                    </button>

                    <button type="button" class="btn btn-danger">
                        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                    </button>
                </td>
            </tr>
        </tbody>
    </table>

.javaScript

<script>
        $('#tblDatos tfoot th').each(function () {
            var title = $('#tblDatos thead th').eq($(this).index()).text();
            if(title!=''){
                $(this).html('<input type="text" placeholder=" ' + title + '" />');
            }
        });
        var table = $('#tblDatos').DataTable({
         
            "bLengthChange": false,
         
            language: {

                search: "Buscar:",
                lengthMenu: "Mostrando _MENU_ datos",
                info: " _START_ de _END_ de _TOTAL_ datos",
                paginate: {
                    first: "primero",
                    previous: "anterior",
                    next: "siguiente",
                    last: "anterior"
                }
            },
            "aoColumnDefs": [{
                "bSortable": false,
                "aTargets": ["no-sort"]
            }]
        });
       
        // Apply the search
        table.columns().eq(0).each(function (colIdx) {
            $('input', table.column(colIdx).footer()).on('keyup change', function () {
                table
                    .column(colIdx)
                    .search(this.value)
                    .draw();
            });
        });

        $('#tblDatos tbody').on('click', 'tr', function () {
            if ($(this).hasClass('selected')) {
                $(this).removeClass('selected');
            }
            else {
                table.$('tr.selected').removeClass('selected');
                $(this).addClass('selected');
            }
        });

</script>

.jquery.dataTables.css

.dataTables_filter {

display: none; 

}