【ハウツー】

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

4 オプションも豊富

    富田宏昭  [2008/06/25]

    利用可能なオプション

    Flexigridはオプションが豊富に用意されており、実行時にJSON形式で指定できる。今回使用したオプションは次のとおり。

    • url : データを実際にやり取りするファイルパスを指定
    • procmsg : 読み込み中に表示するメッセージを変更する
    • pagestat : 読み込み完了後に表示するメッセージを変更する
    • method : データ送信時のメソッドを指定
    • dataType : データ形式を指定。XMLかJSONのうちいずれか
    • colModel : 表示するカラム、ソート可否や幅などを指定
    • searchitems : クイックサーチ用に使用するアイテムを定義
    • sortname : デフォルトでソートするカラムを指定
    • sortorder : デフォルトのソート順を指定
    • usepager : ページャを使用するかしないかを指定
    • useRp : 一度に表示する件数を操作できるようにするかを指定
    • rp : デフォルトの一度に表示する件数を指定
    • width : 幅を指定。autoで自動的に調節
    • height : 高さを指定。autoで自動的に調節

    使い方次第で幅広い用途のリストを作成可能

    ほんの数行のJavaScriptコードを追加するだけで魅力的なUIを提供してくれるFlexigrid。テーブル・カラムサイズの変更が可能になるだけでも魅力的だが、何より嬉しいのはその高い拡張性だ。上記では紹介しきれなかったオプションが他にもいくつかあり、それらを利用することでさまざまな場面で対応できるテーブルリストの作成が可能となる。既存の自前ライブラリやほかのjQueryプラグインと併せてうまく活用し、効率よく開発を行っていきたいところだ。

    他にも有志のユーザによって、Ruby on Rails上での動作サンプルASP上での動作サンプルが公開されている。興味がある方はこれらサンプルサイトもチェックしてみてはいかがだろう。

    関連記事

    関連サイト

    関連したタグ

    新着記事

    特設サイトの情報

      求人情報

      人気記事

      一覧

      イチオシ記事

      新着記事

      特別企画

      転職ノウハウ

      あなたの仕事適性診断

      4つの診断で、自分の適性を見つめなおそう!

      Heroes File ~挑戦者たち~

      働くこと・挑戦し続けることへの思いを綴ったインタビュー

      はじめての転職診断

      あなたにピッタリのアドバイスを読むことができます。

      転職Q&A

      転職に必要な情報が収集できます

      スカウト転職する

      企業からアプローチのメッセージが届きます。

      マイナビニュースマガジン