ブートストラップでテーブルを操作する方法

php中世界最好的语言
リリース: 2018-04-14 16:39:30
オリジナル
1367 人が閲覧しました

今回はBootstrapでテーブルを操作する方法と、Bootstrapでテーブルを操作する際の注意事項を紹介します。

bootstrap-table は bootstrap-table に基づいて書かれており、データを表示するために特別に使用されるテーブル プラグインです。そしてブートストラップの由来は Twitter は現在最も人気のあるフロントエンド フレームワークです。 Bootstrap は HTML、CSS、JAVASCRIPT に基づいており、シンプルさ、柔軟性、迅速なフロントエンド開発という利点があります。ここではブートストラップとブートストラップについては説明しません。この記事では、プロジェクトでの bootstrap-table の使用とその学習方法についての私の理解の一部を説明することに重点を置きます。

まず、jquery、bootstrap、bootstrap-table について説明します。 三人の関係。ブートストラップ コードの多くの部分には jquery が含まれます。 Bootstrap は jquery に依存しており、使用したい bootstrap-table は bootstrap に基づいて作成されるため、bootstrap-table を使用する前に、jquery と bootstrap に関連する js ファイルと css ファイルを参照する必要があります。

次に、bootstrap-table の特徴ですが、 jquery-ui や jqgrid などのテーブル表示プラグインと比較すると、 bootstrap-table はフラットで軽量です。 一部の軽量なデータ表示には十分ですが、親子テーブルの場合は十分です。サポートも非常に優れており、最も重要なことは、他のブートストラップ タグとシームレスに組み合わせることができることです。

1. jsとcssを導入します

<!--css样式-->
<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap/bootstrap-table.css" rel="stylesheet">
<!--js-->
<script src="js/bootstrap/jquery-1.12.0.min.js" type="text/javascript"></script>
<script src="js/bootstrap/bootstrap.min.js"></script>
<script src="js/bootstrap/bootstrap-table.js"></script>
<script src="js/bootstrap/bootstrap-table-zh-CN.js"></script>
ログイン後にコピー

2. テーブルデータの入力

bootStrap テーブルからデータを取得するには、テーブルの data-url 属性でデータ ソースを指定する方法と、JavaScript でテーブルを初期化するときに URL を指定してデータを取得する方法があります。 2 番目の方法は、複雑なデータを処理する際に 1 番目の方法よりも柔軟です。一般に、2 番目の方法はテーブル データを埋めるために使用されます。

りー

フィールド field は、データを表示するためにサーバーから返されたフィールドに対応している必要があります。

3. バックグラウンドでデータを取得します

a. サーブレットがデータを取得します

rree

b. springMvc コントローラーでデータを取得するための対応するメソッド

<table data-toggle="table">
 <thead>
 ...
 </thead>
</table>
 ...
ログイン後にコピー

この記事の事例を読んだ後は、このメソッドを習得したと思います。さらに興味深い情報については、PHP 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

jsは、ミリ秒+日+時間+分秒の変換を実現します


ブートストラップで使用できるカルーセルテンプレートは何ですか



以上がブートストラップでテーブルを操作する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!