C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[6]: GridViewで列の幅を変わらないようにする


(過去ログ 17 を表示中)

[トピック内 7 記事 (1 - 7 表示)]  << 0 >>

■6872 / inTopicNo.1)  GridViewで列の幅を変わらないようにする
  
□投稿者/ ひで (4回)-(2007/08/25(Sat) 12:58:50)

分類:[.NET 全般] 

お世話になります
GridViewで列の幅が変わらないようにするにはどうすればいいのか分かりません。
GridViewのプロパティなどを操作していろいろやっているのですが数値を入れると列の幅が広がってしまいます。
たとえば幅を一定の長さに固定したら変わらないようにしたいのです。
WinXP,VB2005,VWD2005,SQLServer2005の環境です。
よろしくお願いします。




引用返信 編集キー/
■6879 / inTopicNo.2)  Re[1]: GridViewで列の幅を変わらないようにする
□投稿者/ Ri (6回)-(2007/08/26(Sun) 02:14:37)
プロパティ AllowUserToResizeColumns = false にして見てくださいよ。
引用返信 編集キー/
■6884 / inTopicNo.3)  Re[2]: GridViewで列の幅を変わらないようにする
□投稿者/ ぽぴ王子 (261回)-(2007/08/26(Sun) 13:13:07)
ぽぴ王子 さんの Web サイト
そう簡単な問題でもないので、ちょっと他の方の回答を待っていましたが(ずるい)
それもなんなのでとりあえず。

> 分類:[.NET 全般]

[.NET 全般]になっていますが、GridView ということは ASP.NET ですよね。
カテゴリは正しく選択しないと、このように回答がつきません。
分類は正しく選択するようにしてください。

そういう私も

> WinXP,VB2005,VWD2005,SQLServer2005の環境です。

の VWD2005 を見て「ああ、ASP.NET か…」とやっと気づいたぐらいですが。

> プロパティ AllowUserToResizeColumns = false にして見てくださいよ。

AllowUserToResizeColumns は DataGridView のプロパティですし、その場合は
WindowsForm の話になります。これは ASP.NET の話のようですから、ちょっと
違いますね。

GridView は HTML の table として出力されますから、そのテーブルに対して
スタイルシートの table-layout を指定してあげると幅が一定になると思います。
ただし、この場合一行目の幅に固定される(一行目の幅をキチンと設定しておく
必要がある)のと、高さも固定になることに注意が必要です。

参考資料
http://www.htmq.com/style/table-layout.shtml
引用返信 編集キー/
■6905 / inTopicNo.4)  Re[3]: GridViewで列の幅を変わらないようにする
□投稿者/ mあ (43回)-(2007/08/27(Mon) 00:05:44)
No6884 (ぽぴ王子 さん) に返信

> GridView は HTML の table として出力されますから、そのテーブルに対して
> スタイルシートの table-layout を指定してあげると幅が一定になると思います。
> ただし、この場合一行目の幅に固定される(一行目の幅をキチンと設定しておく
> 必要がある)のと、高さも固定になることに注意が必要です。
>
> 参考資料
> http://www.htmq.com/style/table-layout.shtml

高さは伸張してくれますね。
<table border style="table-layout:fixed;">
<colgroup>
<col width="50px" />
<col width="150px" />
<col width="50px" />
</colgroup>
<tr>
<th>No</th>
<th>Name</th>
<th>Zip</th>
</tr>
<tr>
<td>1</td>
<td>あいうえお</td>
<td>213</td>
</tr>
<tr>
<td>1</td>
<td>あいうえおかき</td>
<td>213</td>
</tr>
<tr>
<td>1</td>
<td>あいうえおかきくけ</td>
<td>213</td>
</tr>
<tr>
<td>1</td>
<td>あいうえおかきくけこ</td>
<td>213</td>
</tr>
<tr height="26px">
<td>1</td>
<td>あいうえおかきくけこ</td>
<td>213</td>
</tr>
</table>

各行の高さも設定出来るなら、規定のフォントサイズで固定幅で何文字入るのか見当付けといて
あふれたらまずい(改行されても全部表示したい)行だけは、高さを指定しない、ようにしたら
いいかな。
GridView の制限で、指定した高さを任意に取っ払うことが出来ないなら、テーブルの閉じタグ
直下にスクリプト突っ込んで溢れそうなカラムを持つ行の高さだけ指定をキャンセルさせる、
くらいしか思いつきませんね。

<table border style="table-layout:fixed;" id=TBL1>
<colgroup>
<col width="50px" />
<col width="150px" />
<col width="50px" />
</colgroup>
<tr>
<th>No</th>
<th>Name</th>
<th>Zip</th>
</tr>
<tr height="26px">
<td>1</td>
<td>あいうえおかきくけこ</td>
<td>213</td>
</tr>
</table>
<script>
(function(){
var t = document.getElementById("TBL1");
t.rows(1).style.height = "";
t.rows(1).height = "";
})(); //() とっぱらうとheight="26" が適用、() 付けると height="26" をキャンセル
</script>

こーすれば、全体を表示する必要がある行の規定の高さをキャンセルさせることができます。
表示される行が多いと書き換えが見えてしまう可能性があるので、その見た目の工夫は別途
必要になるかもしれませんね。

引用返信 編集キー/
■6906 / inTopicNo.5)  Re[4]: GridViewで列の幅を変わらないようにする
□投稿者/ ぽぴ王子 (263回)-(2007/08/27(Mon) 01:00:13)
ぽぴ王子 さんの Web サイト
No6905 (mあ さん) に返信

> 高さは伸張してくれますね。

はい。伸張してくれますね。
ただ、伸張してくれないパターンもあります。

あいうえおかきくけこ の部分を ABCDEFGHIJKLMNOPQRSTUVWXYZ… とやってみてください。
スペースの空きは無しで。

ということで、注意が必要なのでした。
いや、全角の時やスペースが入ってワード単位で分割できる(と思われる)時は
伸張してくれるみたいですが、それを調べてなかったのは僕の認識不足と言うことで。
# ワード単位ってことは、どうにかすればうまくいけるんだろうか…

ちなみに僕のオヌヌメは readonly 属性をつけた textarea だったりします。
改行を <br> とかに置換しなくていいしね。
引用返信 編集キー/
■6917 / inTopicNo.6)  Re[5]: GridViewで列の幅を変わらないようにする
□投稿者/ mあ (44回)-(2007/08/27(Mon) 12:09:01)
No6906 (ぽぴ王子 さん) に返信
> ■No6905 (mあ さん) に返信
> 
> あいうえおかきくけこ の部分を ABCDEFGHIJKLMNOPQRSTUVWXYZ… とやってみてください。
> スペースの空きは無しで。
> 

そうですね〜。
んじゃ、これ。
サーブレット側に入れるべき処理ですよね、スクリプトでは重過ぎますが
全てのセルが対象になるとは限らないので問題ないかな?
1文字の占有幅を取得してセル幅ちょい足りないところで改行を入れます。
漢字や空白があるとそこで改行が発生するので、右端−3文字くらいに
それら改行タイミングなコードがあるかどうかチェックしておくとGoodかも
しれないっす。-10 は文字サイズ中のデフォルトフォントでのアルファベット
大文字・小文字の平均幅っすよん。処理終わったら、span タグは取り除く事。

GridView での表示は大抵業務データでしょうから、ワードブレークによる
スケスケ改行よりも有る程度枠一杯のキッチキチ改行の方が有り難い場合が
多いと愚考します。


<table border style="table-layout:fixed;" id="TBL1">
<colgroup>
<col width="50px" />
<col width="150px" />
<col width="50px" />
</colgroup>
<tr>
<th>No</th>
<th>Name</th>
<th>Zip</th>
</tr>
<tr>
<td>1</td>
<td>ABCDE*!"#$%&'( )=~|{}`@*+;:,<>/?_FGHIJKLMNOPQRSTUVWXYZ</td>
<td>213</td>
</tr>
<tr>
<td>1</td>
<td>あABCDEFGHIJごKLMNOPQRSTいUVWXYZ</td>
<td>213</td>
</tr>
<tr>
<td>1</td>
<td><textarea radonly=true width=80px height=100% style="border:none;">ABCDEFGHIJKLMNOPQRSTUVWXYZ</textarea></td>
<td>213</td>
</tr>
<tr>
<td>1</td>
<td>あいうえおかきくけこさしす</td>
<td>213</td>
</tr>
</table>
<script>
<!--//

(function(){
	//テーブルセルの強制改行処理(table-layout:fixed 時)
	//
	var sp = document.body.appendChild(document.createElement("span"));
	var tb = document.getElementById("TBL1");
	sp.innerText = "";
	var cellWidth = tb.rows(1).cells(1).offsetWidth;
	var str = tb.rows(1).cells(1).innerText;

	alert(
	"sp.offsetWidth  => " + sp.offsetWidth + "\n" +
	"cellWidth => " + cellWidth);
	
	var arr = [];
	var ss = "";
	for (var i=0;i < str.length;i++) {
		ss += str.charAt(i);
		sp.innerText = ss;
		if (sp.offsetWidth < cellWidth - 10) continue;
		arr.push(ss);
		ss = "";
	}
         if (ss.length > 0)
	   arr.push(ss);
	
	alert(arr.join("<br />"));
	tb.rows(1).cells(1).innerHTML = arr.join("<br />");
	
})();

//-->
</script>

表示の細かい部分ってのはどこも大変ですよね〜。
業務データとしては、ABC..XYZ なんて文字列は
ありえないのですけどね。(検証データ以外を除く)





引用返信 編集キー/
■6979 / inTopicNo.7)  Re[6]: GridViewで列の幅を変わらないようにする
□投稿者/ ひで (5回)-(2007/08/28(Tue) 12:18:31)
mあさん、ぼび王子さんありがとうございます
大変参考になります。自分なりに工夫してやってみたいと思います。
また分からないことがありましたら宜しくお願いします。
                 ひで
引用返信 編集キー/


トピック内ページ移動 / << 0 >>

このトピックに書きこむ

過去ログには書き込み不可

管理者用

- Child Tree -