How to disable a datatable at the time of printing

Navigation
3

The page has a datatables link , I would like to hide the items that are created by it at the time of printing, example: search field, paging etc.

My datatable looks like this: 

<script>
    $(document).ready(function () {
        $('#minhaTabela').DataTable({
            "language": {
                "lengthMenu": "Mostrando _MENU_ registros por página",
                "zeroRecords": "Nada encontrado",
                "info": "Mostrando página _PAGE_ de _PAGES_",
                "infoEmpty": "Nenhum registro disponível",
                "infoFiltered": "(filtrado de _MAX_ registros no total)",



                "sEmptyTable": "Nenhum registro encontrado",
                "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                "sInfoEmpty": "Mostrando 0 até 0 de 0 registros",
                "sInfoFiltered": "(Filtrados de _MAX_ registros)",
                "sInfoPostFix": "",
                "sInfoThousands": ".",
                "sLengthMenu": "_MENU_ resultados por página",
                "sLoadingRecords": "Carregando...",
                "sProcessing": "Processando...",
                "sZeroRecords": "Nenhum registro encontrado",
                "sSearch": "Pesquisar",
                "oPaginate": {
                    "sNext": "Próximo",
                    "sPrevious": "Anterior",
                    "sFirst": "Primeiro",
                    "sLast": "Último"
                },
                "oAria": {
                    "sSortAscending": ": Ordenar colunas de forma ascendente",
                    "sSortDescending": ": Ordenar colunas de forma descendente"
                }

            }
        });
    });


</script>

To make the impression I'm using css print and put that way to hide more did not work. 

  .lengthMenu,
    .zeroRecords,
    .info,
    .infoEmpty,
    .infoFiltered,
    .sEmptyTable,
    .sInfo,
    .sInfoEmpty,
    .sInfoFiltered,
    .sInfoPostFix,
    .sInfoThousands,
    .sLengthMenu,
    .sLoadingRecords,
    .sProcessing,
    .sZeroRecords,
    .sSearch,
    .oPaginate,
    .oAria {
        display: none;
    }

I would also like to hide the name of the window and the footer that the function takes from the browser.

    
asked by anonymous 19.11.2018 / 17:08

1 answer

0

I'm not sure what to do, but I'm not sure how to do this.

Configurationthattheuserdoes

Butyoucandoagambiarrathatwill"cover up" the information you do not want. Just change the default values of the print margins, so use this rule: 

  @page {
    size: A4;  
    margin: 15pt 0pt 25pt;
  }

This is the print I got with this css above:

OBS: Does not work if the content does not occupy the entire page, as it will not "cover" the footer. But if your container is with display flex you can create a div empty at the end of everything with flex:1 so it will cover the remaining space of the container covering the footer.

Without a div with flex:1 at the end

With%empty%withdivattheend

Aboutremovingotherelementsinflex:1

Butaboutthefieldsyouwanttoremoveinprint,inyourcssincludethis:

@mediaonlyprint{.dataTables_length,.dataTables_filter,.dataTables_info,.dataTables_paginatepaging_simple_numbers{display:none!important;}}

Thetableimpressionshouldbeasintheimagebelowtakenfromthesitethatyouquotedinthequestion:

    
19.11.2018 / 17:23
Handling JSON Response with Retrofit in Android Studio Laravel database connection error