【ハウツー】

わずか数行で"ものすごいテーブル"に! - jQueryプラグイン「Flexigrid」

1 ドラッグ&ドロップでカラム幅を変更可能

 
  • <<
  • <

1/4

Webアプリケーションの操作性を向上させるために、いまや欠かすことのできないJavaScript。Prototype.jsやjQueryといった各種フレームワークを使用して、ユーザビリティを高めている開発者も少なくないだろう。

ここ数年の間でYahoo! UI LibraryExt JSDojo Toolkitといった、開発のしやすさや・操作性の向上はもちろんのこと、綺麗なデザインも兼ね備えているライブラリが増えてきた。既存のWebアプリケーションに少しのコードを追加するだけで、機能もデザインも付加できるこれらのライブラリは非常に魅力的だ。

ここではテーブルで組んだリストに対して、まるで表計算ソフトのような操作性を提供するFlexigridライブラリを紹介したい。

ネイティブアプリケーション並みのリストを実現

FlexigridとはPaulo P. Marinas氏が開発・公開しているjQueryプラグイン。非常に簡単なJavaScriptコードを書くだけで、テーブルに対してカラム別のサイズ変更や表示/非表示の切り替え、サイズの伸縮といったさまざまな視覚効果を与えることができるライブラリだ。またサーバ側でXML形式かJSON形式でテーブル内に表示するデータをやり取りするプログラムを実装すれば、ソートボタンの配置や検索、ページャなどの付加が可能だ。

Paulo P. Marinas氏は次に挙げるWebブラウザで動作確認を行っているとしている。

  • Internet Explorer 6/7
  • Firefox 2
  • Opera 9.x
  • Safari 3.0

現在の最新版は4月1日(米国時間)に公開された1.0beta2。The MIT License、GNU GENERAL PUBLIC LICENSEのデュアルライセンスのもとで公開されている。

  • <<
  • <

1/4

インデックス

目次
(1) ドラッグ&ドロップでカラム幅を変更可能
(2) 既存テーブルにFlexigridを組み込む
(3) ページャ/ソート機能付きテーブルリストを作る
(4) オプションも豊富


転職ノウハウ

あなたが本領発揮できる仕事を診断
あなたの仕事適性診断

シゴト性格・弱点が20の質問でサクッと分かる!

「仕事辞めたい……」その理由は?
「仕事辞めたい……」その理由は?

71%の人が仕事を辞めたいと思った経験あり。その理由と対処法は?

3年後の年収どうなる? 年収予報
3年後の年収どうなる? 年収予報

今の年収は適正? 3年後は? あなたの年収をデータに基づき予報します。

激務な職場を辞めたいが、美女が邪魔して辞められない
激務な職場を辞めたいが、美女が邪魔して辞められない

美人上司と可愛い過ぎる後輩に挟まれるエンジニアの悩み

人気記事

一覧

イチオシ記事

新着記事

樋口大輔の新連載「ホイッスル!W」開幕!2人の主人公が紡ぐ新たなサッカー伝説
[01:20 9/26] ホビー
「orange」アニメ映画化!高野苺の描き下ろし盛り込み、“物語のその後”描く
[01:00 9/26] ホビー
[orange]劇場版アニメが11月18日に公開 原作者の描き下ろしエピソードも
[01:00 9/26] ホビー
空知英秋「銀魂」テレビアニメ新シリーズの放送が決定
[00:00 9/26] ホビー
[都丸紗也華]モンストCMの美女が大胆ビキニ 「ヤンマガ」グラビアで写真集の秘蔵カット公開
[00:00 9/26] エンタメ

求人情報