Ver no GitHub

Bootstrap Table Print

Extensão Print da tabela Bootstrap Table.

Nesta página

Adiciona um botão à barra de ferramentas para imprimir a tabela em um formato pré-definido configurável.

Uso

<script src="extensions/print/bootstrap-table-print.js"></script>

Exemplo

Print

Opções

showPrint

  • Atributo: data-show-print

  • Tipo: Boolean

  • Detalhe:

    Defina true para mostrar o botão Imprimir na barra de ferramentas.

  • Padrão: false

printAsFilteredAndSortedOnUI

  • Atributo: data-print-as-filtered-and-sorted-on-ui

  • Tipo: Boolean

  • Detalhe:

    Defina true para imprimir a tabela conforme classificada e filtrada na interface. Se true for definido, opções de impressão pré-definidas explícitas para filtragem e classificação (printFilter, printSortOrder, printSortColumn). Elas serão aplicadas aos dados já filtrados e classificados pelos controles da interface. Para imprimir dados conforme filtrados e classificados na interface - não defina essas três opções: printFilter, printSortOrder, printSortColumn.

  • Padrão: true

printPageBuilder

  • Atributo: data-print-page-builder

  • Tipo: Function

  • Detalhe:

    Recebe o elemento HTML <table> como um parâmetro de string, retorna uma string HTML para impressão. Esta opção é usada para estilizar e adicionar um cabeçalho ou rodapé.

  • Padrão:

printPageBuilder: function(table, styles) {
  return `
    <html>
    <head>
    ${styles}
    <style type="text/css" media="print">
    @page {
      size: auto;
      margin: 25px 0 25px 0;
    }
    </style>
    <style type="text/css" media="all">
    table {
      border-collapse: collapse;
      font-size: 12px;
    }
    table, th, td {
      border: 1px solid grey;
    }
    th, td {
      text-align: center;
      vertical-align: middle;
    }
    p {
      font-weight: bold;
      margin-left:20px;
    }
    table {
      width: 94%;
      margin-left: 3%;
      margin-right: 3%;
    }
    div.bs-table-print {
      text-align: center;
    }
    </style>
    </head>
    <title>Print Table</title>
    <body>
    <p>Printed on: ${new Date} </p>
    <div class="bs-table-print">${table}</div>
    </body>
    </html>
  `
}

printSortColumn

  • Atributo: data-print-sort-column

  • Tipo: String

  • Detalhe:

    Define o nome do campo da coluna para classificar a tabela impressa.

  • Padrão: undefined

printSortOrder

  • Atributo: data-print-sort-order

  • Tipo: String

  • Detalhe:

    Valores válidos: ‘asc’, ‘desc’. Relevante apenas se printSortColumn estiver definido.

  • Padrão: 'asc'

printStyles

  • Atributo: data-print-styles

  • Tipo: Array

  • Detalhe:

    Adiciona estilos à página impressa, como ícones personalizados.

  • Padrão: []

Ícones

  • print: 'fa-print'

Opções de coluna

printFilter

  • Atributo: data-print-filter

  • Tipo: String

  • Detalhe:

    Define o valor para filtrar os dados impressos por esta coluna.

  • Padrão: undefined

printFormatter

  • Atributo: data-print-formatter

  • Tipo: Function

  • Detalhe:

    Uma function(value, row, index) personalizada - retorna uma string. Formata os valores das células para esta coluna na tabela impressa. O comportamento da função é semelhante à opção de coluna ‘formatter’.

  • Padrão: undefined

printIgnore

  • Atributo: data-print-ignore

  • Tipo: Boolean

  • Detalhe:

    Defina true para ocultar esta coluna na página impressa.

  • Padrão: false

Localizações

formatPrint

  • Tipo: Function

  • Padrão: function () { return "Imprimir" }