普通のテーブルをExcel風に超カッコよくしてくれるjQueryプラグイン「ParamQuery」:phpspot開発日誌
ParamQuery jQuery Grid Plugin 普通のテーブルをExcel風に超カッコよくしてくれるjQueryプラグイン「ParamQuery」 ありきたりなカッコいい、とはいえないような以下のテーブルがあったとします プラグインで初期化すれば、ソータブル、エディタブル、なクールなテーブルに早がわり これは5,6年前でいえば魔法だと思う方は少なくないでしょう。 関連エントリ レスポンシブなテーブルを作るjQueryプラグイン「MediaTable」 テーブルをグラフに変換してくれるjQueryプラグイン レスポンシブなテーブル作りに役立つjQueryプラグイン「FooTable」 テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」 シンプルにテーブルにソート機能を持たせるだけのjQueryプラグイン「jQuery Table So
レスポンシブWebデザインで使えそうな2つのテーブル実装例
以前の投稿で書きましたが、レスポンシブWebデザインでサイトを制作する際の課題の一つは、データの多いテーブルの見せ方です。その課題をクリアする「この方法なら行けるかも！」と思えるものが2つほどあったのでご紹介します。 どちらも甲乙つけがたい良い実装例で、技術的な問題がなければレスポンシブなテーブルの代表的な実装手法になっていくのでは？と思っています。 ドロップダウンでカラムの表示・非表示を選択 まずは、レスポンシブWebデザインの情報を探していると良く出てくるボストンの制作会社、Filament GroupのMaggie Costello Wachsさんが考案したものをご紹介します。オープンソース（GPL License）で、コードは自由に使って良いようです。 以下の画像のように、ドロップダウンメニューを実装して、カラムの表示・非表示をチェックボックスでコントロールできるようになっています
1行のコードで既存のテーブルにソート機能を追加·Table Sorting MOONGIFT
Table Sortingは既存のHTMLテーブルにソート機能を追加するJavaScriptライブラリです。 業務システムなどでテーブルを表示すると常に足らない機能を求められます。その第一が並べ替え機能でしょう。DBを操作しても良いですが、もっと単純に解決したいならTable Sortingを使ってみても良さそうです。 デモです。 カラムのクリックでソートが実行されます。 金額部分もきちんとソートされます。 JavaScriptのコードです。単純にクラスを指定するだけ。 HTMLのコードです。数値部分にも特に設定を行っていないところに注目。 Table Sortingは既存のテーブルを渡すだけで自動的にソート機能を追加してくれます。オブジェクトの型も判断して並び替えてくれるので手間いらずです。 Table SortingはJavaScript製、GPL v3のオープンソース・ソフトウェアで
一見普通のテーブルだけどExcel風に使えるjQueryプラグイン「Handsontable」:phpspot開発日誌
jQuery Rain | jquery-handsontable @ GitHub 一見普通のテーブルだけどExcel風に使えるjQueryプラグイン「Handsontable」。 Excelのテーブル風ウィジェットは色々ありますがリッチすぎて重いようなものは使いづらかったりします。 今回紹介するjQueryプラグインを使えば、Ctrl+C,Vでコピペできたり、セルに内容を直接入れたりといったことができます。 シンプルなので超軽量 入力していくと自動でサイズが再調整されてどんどん入力できます 実装コード例。初期データはJSONで指定 onchangeでコールバック関数が指定できるので変更時にサーバにデータを投げて保存といったことが可能みたい 関連エントリ Excelそっくりな表計算モジュールを実装可能なオープンソースモジュール「Gelsheet」 WEBページにExcel風スプレッドシー
テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」:phpspot開発日誌
テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」 2012年05月08日- tablecloth.js テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」 $('table').tablecloth() と記述で簡単にテーブルをカッコよくスタイリングできます。テーマも選べる模様。 ソート可能にしたり、ストライプなデザインにしたりといったカスタマイズも可能。 実装できるデザイン例。Twitter Bootstrap と組み合わせたテーマ２種類とその他２種類のテーマがデモとして表示されています 意外と手間取るテーブルデザインですが、こうしたものを参考に美しくデザインしたいものですね 関連エントリ CSS3でクールな角丸テーブルを作る例 シンプルにテーブルにソート機能を持たせるだけのjQueryプラグイ
シンプルにテーブルにソート機能を持たせるだけのjQueryプラグイン「jQuery Table Sort」:phpspot開発日誌
jQuery Table Sort | The Stupid Table Plugin by JoeQuery シンプルにテーブルにソート機能を持たせるだけのjQueryプラグイン「jQuery Table Sort」 リッチなUIにするわけでもなく、ただヘッダーをクリックすると内容がソートされる機能を実現するためのプラグインです。 自分でテーブルをデザインしたい方には使い勝手が良いだけでなく超軽量なのもいいです クリックでソート↓ 使い方もライブラリを読み込んだら１行でOKです 関連エントリ アイテムを浮遊させられるjQueryプラグイン「jqFloat」 リアルなドラッグ＆ドロップが実現できるjQueryプラグイン「pep.jquery.js」 コンテンツの折りたたみを楽々実装できるjQueryプラグイン「jQuery Collapse」 ページ全体に広がるスライドショーを実装できるj
データベース連動型のAjaxを使ったテーブル実装jQueryプラグイン「jTable」:phpspot開発日誌
jTable.org - A JQuery plugin to create AJAX based CRUD tables - Home Page データベース連動型のAjaxを使ったテーブル実装jQueryプラグイン「jTable」 CRUDの操作が可能でその場で編集、削除といった作業ができるのは便利です 画面遷移なしに編集が可能 削除の場合、確認ダイアログが出て削除可能 お手軽になりますが、使い所によっては危険なので慎重に使いたい所ですね 関連エントリ 長ーいテーブルも瞬時にページング処理してしまうjQueryプラグイン「Table Pagination」 テーブルのカラムをドラッグ＆ドロップでリサイズできるようにするjQueryプラグイン「colResizable」 階層構造が作れるテーブルを実現できるjQueryプラグイン「treeTable」 テーブルをちょっとだけ使いやすくして
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
