- PR -

ヘッダー固定（DataGrid）

1|2 次のページへ»
投稿者投稿内容
masa
常連さん
会議室デビュー日: 2002/07/15
投稿数: 38
お住まい・勤務地: 福岡県
投稿日時: 2006-10-05 18:57
WEBプロジェクトで
DataGridのヘッダーを固定させてスクロールさせるというものを作りました。

スタイルシートに
head{
background-color:blue;
POSITION: relative;
TOP : expression(this.offsetParent.scrollTop-1);
Z-INDEX : 9;
}
と定義してDataGridのHederStyleのCssClassに設定しているんですが、
ヘッダーは固定されるんですが、ヘッダーの境界線が消えてしまいます。
いろいろ試したんですが、BackColorを設定をとくと境界線表示されます。
どなたか、対処方法やヒントなど教えてくださる方いらっしゃいましたら
お願いしますm(_ _)m
Jitta
ぬし
会議室デビュー日: 2002/07/05
投稿数: 6267
お住まい・勤務地: 兵庫県・海手
投稿日時: 2006-10-05 20:04
検索はした？右上に小さく、リンクがあるんだけど。
_________________
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2006-10-06 06:41
引用:

DataGridのHederStyleのCssClassに設定しているんですが、
ヘッダーは固定されるんですが、ヘッダーの境界線が消えてしまいます。
いろいろ試したんですが、BackColorを設定をとくと境界線表示されます。

DataGridのヘッダーに背景色を設定してごまかすとか？

↓こんな感じです。
http://www.friendlysw.com/aspnet/Articles/Goto.aspx?id=050929-1
_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
masa
常連さん
会議室デビュー日: 2002/07/15
投稿数: 38
お住まい・勤務地: 福岡県
投稿日時: 2006-10-06 10:46
Jittaさん検索はしたんですが、なかなか該当するものがなくて
CellSpacingを1にしたりすれば境界線は見えるようになるんですが、
２重線になって見た目も悪くなってしまいます。
他に何かないかと相談させてもらった次第です。
masa
常連さん
会議室デビュー日: 2002/07/15
投稿数: 38
お住まい・勤務地: 福岡県
投稿日時: 2006-10-06 10:51
Accessさんありがとうございます。
できれば、CssやHTMLを修正すればどうにかなるかと思ったんですが、
やはりむりですかね？

自分もこれからいろいろやってみようと思います。

ソースをのせますのでおかしい点やいいアイディアありましたらご教授ください。

＊ソース＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
<head>
<style type="text/css">
.head{
POSITION: relative;
TOP : expression(this.offsetParent.scrollTop-1);
Z-INDEX : 9;
background-color:CornflowerBlue;
}
.item{
background-color:White;
}

</style>
</head>
<body>
<DIV id="Pl" style="Z-INDEX: 102; LEFT: 16px;
OVERFLOW: auto; WIDTH: 1192px; BORDER-TOP-STYLE: groove;
BORDER-RIGHT-STYLE: groove; BORDER-LEFT-STYLE: groove;
POSITION: absolute; TOP: 376px; HEIGHT: 306px;
BORDER-BOTTOM-STYLE: groove" ms_positioning="FlowLayout">
<table cellspacing="0" cellpadding="1" rules="all" bordercolor="Black"
border="2" id="Grid" style="border-color:Black;border-width:2px;
border-style:Solid;font-family:verdana;font-size:8pt;
height:248px;width:1168px;border-collapse:collapse;">
<tr class="head">
<td>AAAAAAAA</td><td>BBBBBBBBB</td><td>CCCCCCCCCCCC</td>
</tr>
<tr class="item">
<td> 111111111111111</td>
<td> 222222222222222</td>
<td> 333333333333333</td>
</tr>

<tr class="item">
<td> 111111111111111</td>
<td> 222222222222222</td>
<td> 333333333333333</td>
</tr>

<tr class="item">
<td> 111111111111111</td>
<td> 222222222222222</td>
<td> 333333333333333</td>
</tr>

<tr class="item">
<td> 111111111111111</td>
<td> 222222222222222</td>
<td> 333333333333333</td>
</tr>
</table></DIV>
</body>
Ｒ・田中一郎
ぬし
会議室デビュー日: 2005/11/03
投稿数: 979
投稿日時: 2006-10-06 11:31
解決するかどうかわかりませんが、僕はこんな風に書くのが好きです。

<table border=0 cellspacing=1 bgcolor='#FF0000'>
<tr bgcolor='#FFFFFF'><td>あ</td><td>か</td>
<tr bgcolor='#FFFFFF'><td>い</td><td>き</td>
</table>

当然、cellspacing の値を増やすと線が太くなります。
_________________
Ｒ・田中一郎 - 　R.Tanaka.Ichiro’s Blog
masa
常連さん
会議室デビュー日: 2002/07/15
投稿数: 38
お住まい・勤務地: 福岡県
投稿日時: 2006-10-06 11:46
Ｒ・田中一郎さんありがとうございます。

今いろいろと試していたんですが、
スクロールさせるとヘッダ自体がスクロールさせられるみたいで
境界線を太くしてやってみたんですが、太くなった境界線も上にスクロール
されるみたいで…

今、MyDataGrid_ItemDataBoundのイベントで
ヘッダーの<td>に背景色をつけてやってます。
これしか方法ないんですかね…
微妙に項目の線とヘッダの空白部分がずれてるし……って感じです。(;_;)
Ｒ・田中一郎
ぬし
会議室デビュー日: 2005/11/03
投稿数: 979
投稿日時: 2006-10-06 22:55
引用:

masaさんの書き込み (2006-10-06 11:46) より:
Ｒ・田中一郎さんありがとうございます。

今いろいろと試していたんですが、
スクロールさせるとヘッダ自体がスクロールさせられるみたいで

僕は .NET でWEB系のソフトを書いたことが無いので外しているかもしれませんが、CSS のクラス class= とか適当に付けてやってもヘッダ自体がスクロールされたりします？
_________________
Ｒ・田中一郎 - 　R.Tanaka.Ichiro’s Blog
1|2 次のページへ»

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