- PR -

GridViewのHeader固定について

1|2 次のページへ»
投稿者投稿内容
青森
会議室デビュー日: 2007/05/27
投稿数: 16
投稿日時: 2007-06-11 05:45
過去のスレッドを参考に試していますが、悩んでいます。
GridViewは縦と横スクロールを設定しており、Headerの固定はできました。
しかし、横スクロールはGridViewのデータ部分のみが対象となり、Headerは対象となりません。

何方かご存知でしたらおしえてください。
Sourceはこんな感じです。

asp.net2.0(c#)

.GridStyle{overflow:scroll}
.Freezing
{
position:relative;
top:expression(this.offsetparent.scrollTop);
z-index:10;
}

＜div class="GridStyle"＞
＜asp:GridView style:"overflow:auto"＞
＜HeaderStyle CssClass="Freezing"＞
＜/asp:GridView＞
＜/div＞

青森
会議室デビュー日: 2007/05/27
投稿数: 16
投稿日時: 2007-06-16 01:59
見栄えの問題なので後回しにしていました。
数日おけば考えもうかぶかな、と思い再チャレンジしたのですが、駄目です。
単にHTMLの書き方に問題があるのでしょうか。

どなたか、アドバイスをお願いします。
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2007-06-16 10:20
以下のサンプルが参考になるかと！

GridViewのヘッダーを固定
http://www.ajax-asp.dev-asp.net/Goto.aspx?id=070616VB-1

GridViewのヘッダーと列を固定
http://www.ajax-asp.dev-asp.net/Goto.aspx?id=070616VB-2
_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
青森
会議室デビュー日: 2007/05/27
投稿数: 16
投稿日時: 2007-06-16 12:02
Accessさん、ご返事ありがとうございます。
URLのSourceを参考にしてみたのですが、やはりHeaderがGridViewの外へ出てしまいます。
参考Sourceとの違いは、
・GridViewのバインドはDataSource未使用
・Ajax未使用
位なのですが、これは関係ないかと。。。
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2007-06-16 13:03
ソースの「DOCTYPE」をコメントにしているか確認してください。

<%--
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
--%>

サンプルの解説には、注意事項として記述してあるのですが説明するのを
忘れました。ゴメン！　m(__)m

なお、このサンプルはIEでしか動作しないなど制約がありますので注意してください。
_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
青森
会議室デビュー日: 2007/05/27
投稿数: 16
投稿日時: 2007-06-16 15:44
Accessさん、ご返事ありがとうございます。

ご指摘の通りでした。
コメントにしたらスクロールされました！！！
ホントありがとうございます、感動です。

あともう1点教えて下さい。
このコメントは何なのでしょうか。
青森
会議室デビュー日: 2007/05/27
投稿数: 16
投稿日時: 2007-06-16 16:48
ソースの「DOCTYPE」をコメントについて、ご教授下さい。
教えて頂いたコメント対応によりHeaderの固定はできましたが、今度はフォントサイズの指定が効かなくなりました。

そこで基本的な事なのですが、実際に業務で使用する場合、当箇所をコメントにする事はあるのでしょうか。

Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2007-06-17 06:02
引用:

青森さんの書き込み (2007-06-16 16:48) より:
ソースの「DOCTYPE」をコメントについて、ご教授下さい。
教えて頂いたコメント対応によりHeaderの固定はできましたが、今度はフォントサイズの指定が効かなくなりました。

Googleで「DOCTYPEとは」で検索してください。

ここが分かりやすいかな？
http://css.webmeister-jp.com/tips/doctype.php

IE,Firefox, Safariなどの最新のブラウザは、
２つの表示モード（互換モード｜標準モード）をサポートしています。

DOCTYPEを宣言することにより、ブラウザにどのモードで表示させるかを指示
することができます。

VS 2005がデフォルトで生成する、DOCTYPEは「XHTML 1.0 Transitional」になって
いますので「標準モード」で動作します。

ところが、このサンプルで使用しているCSSは「標準モード」では動作しないので
DOCTYPEをなしにして「互換モード」で動作させています。

たとえば、IE5にはCSSのバグがありますが、このバグを考慮して設計したWebページ
があるとします。MSがIE6,IE7でこのバグを修正していますが、この場合Webページ
が正常にレイアウトされない問題が発生します。

このような不都合を回避するために、「DOCTYPE」を使用します。

CSSのバグを考慮したWebページの場合、DOCTYPEに「HTML 4.0 Transitional」、
「HTML 4.01 Transitional」を設定することによりブラウザが互換モード（バグ付きの仕様）で
動作しますのでWebページが期待したようにレイアウトされます。

フォントサイズですが、互換モード用に切り替えてはどうでしょうか？
_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
1|2 次のページへ»

スキルアップ／キャリアアップ（JOB@IT）