wenzhixin/bootstrap-table

これは何？

主な機能

• 01クリックによる列のソートとページネーション
• 02チェックボックスまたはラジオボタンによる単一・複数行の選択
• 03列、ヘッダー、フッターの表示切り替え
• 04固定ヘッダーでのスクロールとレスポンシブレイアウト
• 05行のカード表示と詳細表示
• 06JSON形式でのAJAXデータ読み込みとローカライズ対応

ユースケース

• Bootstrapで構築した管理ダッシュボードに、ソートやページネーションに対応したデータテーブルを追加する
• Webアプリケーションで、AJAX経由で読み込んだサーバー側のレコードを表示する
• 一括操作の対象として、ユーザーが1行以上を選択できるリストを作成する

クイックスタート

1. 1

   npmでパッケージをインストールする

   npm install bootstrap-table
2. 2

   またはYarnでパッケージをインストールする

   yarn add bootstrap-table

使う前に知っておきたいこと

• !スタイル設定にはBootstrapまたは別のCSSフレームワークが必要です。

トピック

よくある質問

bootstrap-table とは？

BootstrapなどのCSSフレームワーク向けに、ソート、ページネーション、行選択、拡張機能を追加するHTMLテーブルプラグイン。 Bootstrap Tableは、シンプルなHTMLテーブルを多機能なデータグリッドに変えるJavaScriptプラグインです。Bootstrapと連携できるほか、Semantic UI、Bulma、Material Design、Foundation、Vue.jsにも対応しているため、これらのフレームワークを使った既存プロジェクトに導入できます。

bootstrap-table は無料で使えますか？ライセンスは？

bootstrap-table は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

bootstrap-table は今もメンテナンスされていますか？

活発にメンテナンス中。bootstrap-table の最終コミットは 2026年11月6日 です。

bootstrap-table は何に使えますか？

Bootstrapで構築した管理ダッシュボードに、ソートやページネーションに対応したデータテーブルを追加する Webアプリケーションで、AJAX経由で読み込んだサーバー側のレコードを表示する 一括操作の対象として、ユーザーが1行以上を選択できるリストを作成する

bootstrap-table のインストール方法は？

npmでパッケージをインストールする: npm install bootstrap-table またはYarnでパッケージをインストールする: yarn add bootstrap-table

bootstrap-table はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/wenzhixin/bootstrap-table