[B! table] biz-atcのブックマーク

テーブル表示がここまでリッチに多機能に。jQuery製ライブラリ·OpenJS MOONGIFT

OpenJSはテーブル表示をリッチなUIにし、並び替えや編集などの機能を追加するライブラリ。 OpenJSはjQuery/JavaScript製のオープンソース・ソフトウェア。企業システムはもちろん、Webサービスの管理画面などで求められるのがテーブルベースのデータ一覧表示機能だ。そしてテーブルを作るとソートやフィルタリング、その場での編集機能などが求められるようになる。画像表示そんな機能を作り込むのはとても大変だ。だがユーザの立場に立てば、一件ずつ編集するのも大変なことだろう。そこで外部ライブラリに頼ろう。OpenJSはとてもリッチな編集インタフェースを提供してくれる。 OpenJSは通常のテーブルタグで作られた表を、角丸でかなりリッチなUIにしてくれるライブラリだ。カラムで並び替えたり、画像のサムネイルを表示する、フィルタリングやページネーション機能もある。Ajaxでスムーズに操作

biz-atc 2012/04/02

jquery
table

リンク

jQueryでテーブルに行を追加する方法

jQueryでテーブル（table要素）に行を追加する方法を紹介します。テーブル操作は、テーブル系のjQueryプラグインで色々なことが実現できると思いますが、業務で使っているツールでこの機能がピンポイントで必要になったため自力で作りました。単に追加するだけであれば後述するappend()とprepend()で大丈夫です。ただアニメーション表示する方法についてはネットで色々探しましたが同様の情報がなかったので試行錯誤して作りました。テーブルを操作する場合の参考になれば幸いです。１．サンプルまずはサンプルで動作をご確認ください。 jQueryでtableに行を追加するサンプルサンプルでは行の追加・削除・全削除が行えます。２．テーブルの先頭に行を追加する行をtable要素の先頭に追加するには次のように記述します。 $('tbody').prepend('<tr><td>～</td

biz-atc 2012/02/14