[[Open棟梁Project>http://opentouryo.osscons.jp/]] - [[マイクロソフト系技術情報 Wiki>http://techinfoofmicrosofttech.osscons.jp/]]

* 目次 [#g17e796e]
#contents

*概要 [#sb20d9aa]
業務アプリの要件で多い、Gridのヘッダ固定方法について纏めました。

*一般的?な方法 [#o349b173]
コチラが参考になります。

-スクロールテーブルを実装する際の注意点~
http://defghi1977-onblog.blogspot.jp/2012/02/blog-post_09.html
++テーブル分割法
++pushpin header法
++display:block法
++freezing法
++tbody-float法(NEW)
++element関数法(NEW)

比較表まで合って便利。

余談:freezing法はIE固有機能のため、最近は使用しないようです。

*その他の方法 [#i3d224fc]
上記の方法でも良いと思いますが、代替案を2つほど提案しておきます。

**readonly属性を使用する。 [#d2dabf5b]
ReadOnly=TrueのTextBoxを使用することで、Gridの幅が可変にならずに住みます。

これにより、必ず、テキストボックスの幅で収まります。

HTML上は、
 <input name="b" type="text" value="hoge" readonly="readonly" />
となる。

Enable=Falseではないので注意。

-小粋空間 input 要素の disabled 属性と readonly 属性の違い~
http://www.koikikukan.com/archives/2009/04/26-003300.php

**JQueryを使用する。 [#gf5d446b]

-jQueryでテーブルのヘッダーを固定する « Hello My World~
http://plmin.us/blog/2012/09/13/table-heade-fixed-jquery/

やり方が沢山あって、絞るのが難しそうです。

-JavaScriptのGridライブラリ決定版 - SlickGrid - Qiita~
http://qiita.com/icoxfog417/items/98e34c0555991033afec

Gridライブラリも沢山あって、絞るのが難しそうです。

***jQGridを使用する。 [#v7bebf0a]
jqGridも問題が多いようです。~

-jqGrid4.3.1の新機能(Group Header, Frozen Cols)を試す、~
そしてハマりどころ解説 - Taste of Tech Topics~
http://acro-engineer.hatenablog.com/entry/20120108/1326046564

-jqGridとASP.NETとの組合わせ実装方法はコチラが参考になる。~
https://github.com/SymphonyTeleca/SampleProgram/tree/master/ASPNET/WebForm/jqGridandWCF

また、次バージョンからライセンスが~
MITから「CC BY-NC(表示-非営利)」に変更され、~
商用利用ができなくなるという情報があります。

-jQuery Grid Plugin – jqGrid » jqGrid is now Guriddo~
http://www.trirand.com/blog/?p=1438
>jqGrid JavaScript shall change its license from MIT/GPL 2 to Creative Commons Attribution-NonCommercial 3.0 License.

トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS