QA@IT

Gridviewで列固定をしたい

15846 PV

開発環境:ASP.NET(C#.NET/VS2010/.NETFramework4.0)

GridViewでExcelのような列固定を行いたいのですが、
サイトを見ているとStyleに「left: expression(document.getElementById("freezingDiv").scrollLeft)」などを
記載してるサンプルはあるのですが、表示ブラウザがIE8以降のため使用出来ないのかなと判断しました。
有償ツールなどを使用しないで他に実装する方法はありますか?

現在、GridViewのページャーはPagerTemplateでへ変更しており、
ヘッダーは一部縦書きの箇所もあります。
※縦書きは「writing-mode: tb-rl;」を記載しています。

回答

Styleに「left: expression(document.getElementById("freezingDiv").scrollLeft)」
※縦書きは「writing-mode: tb-rl;」を記載しています。

両方とも IE の独自実装で、当然 Firefox など他のブラウザでは動きませんし、IE でも互換モードでないと動きません。

特に両方一緒にまともに動かすというのはどうやっても無理っぽいです。(自分が試した限りですが)

そちらの方向に進むと、費やす努力が無駄になる可能性が大なので、自分はまったくお勧めできません。

どうしてもというなら、expression 関数だけ(ヘッダの固定だけ)なら、meta タグの設定で互換モード(Quirks モード)にすれば、IE8 でも動くと思いますが。

詳しくは以下のページを見てください。「実験室」と書いたリンク先で実際に動かして試すことができます。

GridView のヘッダ、列を固定
http://surferonwww.info/BlogEngine/post/2011/04/30/Freezing-GridView-header-and-column.aspx

有償ツールなどを使用しないで他に実装する方法はありますか?

縦書きはできませんが、ヘッダの固定だけなら以下のページに紹介したような JavaScript/jQuery ライブラリがあります。

GridView のヘッダ、列を固定(その 2)
http://surferonwww.info/BlogEngine/post/2013/02/04/freezing-header-and-column-of-gridview-by-using-javascript-gridjs.aspx

ググって探せば他にもいろいろ見つかると思いますでの探してみてください。

編集 履歴 (0)
  • ブラウザに関してはIE固定ではあるのですが、当然IE8以降も対象となります。
    元々、GridViewで表示する列数が多い(50以上)、かつ、ほとんどの列のデータが○×のみの表示のため、縦書きで少しでも表示できるようにしたいとの要望となっています。

    -
  • expressionにwritting-modeを同時設定し、互換モードにした場合は動くには動きましたが、ヘッダーの表示が変な状態になり断念しました。
    縦書きはどうしてもはずせない要望のため、JQueryも使えなさそうですね。
    他にもぐぐってみます。
    -
  • 「ヘッダーの表示が変」になったということは、質問する前に試して知っていたようですね、であれば、そのことは最初に書いておいてほしかったです。 -
  • 遅くなりました。
    確かに、自分で試したことは書いてなかったですね。
    縦書きだけ元々してて、そこにexpressionを単純追加したら変になったので、他に方法があるかなと思ってました。
    -
ウォッチ

この質問への回答やコメントをメールでお知らせします。