【JQuery】DataTables に 行(JSON)を追加してみる

Javascript,開発

おはようございます。

昨日に引き続き Datatables の基本的な話。

前回は HTML に記述したテーブルを Datatables に変換する感じでしたが、

今日は表示するデータを Json にして、行追加してみたいと思います。

スポンサーリンク

プログラム

画面

css/style.css

index.html

HTMLにベタ書きしていた行は削除。

スクリプト

js/script.js

JSONで定義したデータをテーブルに反映、ボタン押下で新しい行を追加。

イメージ

初期表示
初期表示

追加ボタンをクリックします。

行追加
行追加

テーブルに行が追加されました。

イメージは、前回と同じです(汗

まとめ

今回は1行のみ追加しましたが、複数行も JSON で定義すれば一括で追加することも可能です。

大した話ではありませんが何かのお役に立てれば。

ではでは。

 

スポンサーリンク


関連するコンテンツ