GitHub で確認

テーブル印刷

Bootstrap Table のテーブル印刷拡張機能。

あらかじめ定義された設定可能な形式でテーブルを印刷するためのボタンをツールバーに追加します。

使用方法

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

例

印刷

オプション

showPrint

属性: data-show-print
型: Boolean
詳細

ツールバーに印刷ボタンを表示するには true を設定します。
デフォルト: false

printAsFilteredAndSortedOnUI

属性: data-print-as-filtered-and-sorted-on-ui
型: Boolean
詳細

UI でソートおよびフィルタリングされたテーブルを印刷するには true を設定します。true が設定されている場合、フィルタリングとソートの明示的な事前定義された印刷オプション（printFilter、printSortOrder、printSortColumn）が適用されます。これらは、UI コントロールによって既にフィルタリングおよびソートされたデータに適用されます。UI でフィルタリングおよびソートされたデータの印刷には、これらの3つのオプション（printFilter、printSortOrder、printSortColumn）を設定しないでください。
デフォルト: true

printPageBuilder

属性: data-print-page-builder
型: Function
詳細

HTML <table> 要素を文字列パラメータとして受け取り、印刷用のHTML文字列を返します。このオプションは、スタイル設定やヘッダーまたはフッターの追加に使用されます。
デフォルト

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

属性: data-print-sort-column
型: String
詳細

印刷されたテーブルでソートする列フィールド名を設定します。
デフォルト: undefined

printSortOrder

属性: data-print-sort-order
型: String
詳細

有効な値：「asc」、「desc」。printSortColumn が設定されている場合にのみ関連します。
デフォルト: 'asc'

printStyles

属性: data-print-styles
型: Array
詳細

カスタムアイコンなど、印刷ページにスタイルを追加します。
デフォルト: []

アイコン

印刷: 'fa-print'

列オプション

printFilter

属性: data-print-filter
型: String
詳細

この列で印刷データをフィルタリングする値を設定します。
デフォルト: undefined

printFormatter

属性: data-print-formatter
型: Function
詳細

カスタム function(value, row, index) - 文字列を返します。印刷されたテーブルでこの列のセル値をフォーマットします。関数の動作は、「formatter」列オプションに似ています。
デフォルト: undefined

printIgnore

属性: data-print-ignore
型: Boolean
詳細

印刷ページでこの列を非表示にするには true を設定します。
デフォルト: false

ローカライズ

formatPrint

型: Function
デフォルト: function () { return "Print" }