[Seasar-user:8323] Re:Teedaを使用した複数行表示レコード出力方法
[E-MAIL ADDRESS DELETED]
[E-MAIL ADDRESS DELETED]
2007年 6月 14日 (木) 15:48:18 JST
大谷様
坂口です。
Teeda-html-exampleのview/grid/multiRowGrid2.htmを参考したが、
サンプルHTMLファイルでもcol要素のspan属性値を2から1に変更すると同様の現象が再現します。
<!-- 変更前 -->
<colgroup>
<col span="2" width="60px" class="T_leftFixed" /> // 固定列を2行
<col span="1" width="70px" />
</colgroup>
<!-- 変更後 -->
<colgroup>
<col span="1" width="60px" class="T_leftFixed" /> // 固定列を1行
<col span="1" width="70px" />
</colgroup>
th要素のrowspan属性を2以上にした場合、上記col要素のspan属性値は2以上にしないと、固定列のレイアウトが崩れるようです。
どうにかして1列目だけ固定にする方法はないのでしょうか。
ご教授お願い致します。
>大谷です。
>
>Teeda-html-exampleのview/grid/multiRowGrid2.htmlを
>参考にしてみていただけますでしょうか。
>宜しくお願いします。
>
>07/06/13 に [E-MAIL ADDRESS DELETED]<[E-MAIL ADDRESS DELETED]> さんは書きました:
>>
>>
>>
>> はじめまして。
>> 坂口 と申します。
>>
>> 現在、Teedaのgridコンポーネントを使用し下図のような行/列を固定した複数行表示レコードを表示しようとしています。
>> (a,b,cを記載している列を固定、aを記載している行を固定にしている)
>>
>> _ __ __ __ __ __ __ __ __ __ __ __ __ __ _
>> | a |_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|
>> |_ _ _ |_ _ _ _ _ _| _ _ _ _ _ _ _ _ |_ _ _ _ _ |
>> | b |_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|
>> |_ _ _ |_ _ _ _ _ _| _ _ _ _ _ _ _ _ |_ _ _ _ _ |
>> | c |_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|
>> |_ _ _ |_ _ _ _ _ _| _ _ _ _ _ _ _ _ |_ _ _ _ _ |
>>
>> gridコンポーネントを使用して展開されたHTMLでは下図のように固定列の表示が崩れてしまいます。
>> 原因と対策方法をご教授いただきたく。(現象が発生するHTMLとpageクラスを資料として下記に記載します。)
>> _ __ __ __ __ __ __ __ __ __ __ __ __ __ _
>> | a |_ |_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|
>> | _ | b |_ _ _ _ _ _| _ _ _ _ _ _ _ _ |_ _ _ _ _ |
>> | |_ _|_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ |
>> | _c| | _ _ _ _ _ | _ _ _ _ _ _ _ _ |_ _ _ _ _ |
>> | |_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|
>> |_ _ _ |_ _ _ _ _ _| _ _ _ _ _ _ _ _ |_ _ _ _ _ |
>>
>>
>>
>> 【環境】
>> OS: Windows XP
>> 開発環境
>> Eclipse SDK 3.2.0
>> Seasar 2.4.13
>> Teeda 1.0.7
>> dolten 0.20.1
>> Tomcat 5.5.23
>>
>>
>>
>> -- 資料 --
>> ★HTML
>> <html>
>> <body>
>> <style>
>> .gridHeader {
>> background-color: green;
>> color: white;
>> font-weight: bold;
>> overflow: hidden;
>> }
>> .gridTable {
>> background-color: green;
>> }
>> .gridCell {
>> height: 25px;
>> background-color: white;
>> }
>> </style>
>>
>> <table align="center" id="hogeGridY" width="420px" height< FONT
>> COLOR="#000000" SIZE=2 FACE="ＭＳ ゴシック">="150px" >
>> <colgroup>
>> <col span="1" width="40px" class="T_l eftFixed" />
>> <col span="3" width="360px" />
>> </colgroup>
>> <thead>
>> <tr style="background-color:#E6E6FA;">
>> <th rowspan="2" style="width:40px;height:40px;">1an
>> d2Line_1Row</th>
>> <th colspan="3"
>> style="width:360px;height:20px;">1Line_2and3 and4Row</th>
>> </tr>
>> <tr style="background-color:#E6E6FA;">
>> <th colspan="1" style="width:120px;">2Line_2Row</th>
>> <th colspan="1" style="width:120px;">2Line_3Row</th>
>> <th colspan="1" style="width:120px;">2Line_4Row</th>
>> </tr>
>> </thead>
>> <tbody>
>> <tr >
>> <td rowspan="2"
>> style="width:40px;height:40px;"><span < FONT COLOR="#7F007F" SIZE=2 FACE="ＭＳ
>> ゴシック">id="aa" >aa</span></td>
>> <td colspan="3"
>> style="width:360px;height:20px;"><span id="bb">bb</span></td>
>> </tr>
>> <tr >
>> <td colspan="1" style="width:120px;"><span id="cc"
>> >cc</span></td>
>> <td colspan="1" style="width:120px;"><span id="dd"
>> >dd</span></td>
>> <td colspan="1" style="width:120px;"><span id="ee"
>> >ee</span></td>
>> </tr>
>> </tbody>
>> </table>
>>
>> </body>
>> </html>
>>
>>
>> ★pageクラス
>> package tutorial.chura.web.grid;
>>
>> import java.util.ArrayList;
>> import java.util.List;
>>
>> public class MultiLineTablePage{
>>
>> private String aa;
>> private String bb;
>> private String cc;
>> private String dd;
>> private String ee;
>>
>> private int hogeIndex;
>> private List hogeItems;
>>
>> public String getAa() {
>> return aa;
>> }
>> public void setAa(String aa) {
>> this.aa = aa;
>> }
>> public String getBb() {
>> return bb;
>> }
>> public void setBb(String bb) {
>> this.bb = bb;
>> }
>> public String getCc() {
>> return cc;
>> }
>> public void setCc(String cc) {
>> this.cc = cc;
>> }
>> public String getDd() {
>> return dd;
>> }
>> public void setDd(String dd) {
>> this.dd = dd;
>> }
>> public String getEe() {
>> return ee;
>> }
>> public void setEe(String ee) {
>> this.ee = ee;
>> }
>> public int getHogeIndex() {
>> return hogeIndex;
>> }
>> public void setHogeIndex(int hogeIndex) {
>> this.hogeIndex = hogeIndex;
>> }
>> public List getHogeItems() {
>> return hogeItems;
>> }
>> public void setHogeItems(List hogeItems) {
>> this.hogeItems = hogeItems;
>> }
>> public String initialize() {
>> return null;
>> }
>>
>> public String prerender() {
>>
>> List list = new ArrayList(5);
>> for(int i=0; i < 5; i++) {
>> ListData listData = new ListData(i);
>> list.add(listData);
>> }
>> setHogeItems(list);
>>
>> return null;
>> }
>>
>> /**
>> * インナークラス
>> * 現象を一つのJavaファイルで
>> * 再現したかった為、使用。
>> */
>> public class ListData{
>>
>> private String aa;
>> private String bb;
>> private String cc;
>> private String dd;
>> private String ee;
>>
>> ListData(int data) {
>> setAa("aa" + data);
>> setBb("bb" + data);
>> setCc("cc" + data);
>> setDd("dd" + data);
>> setEe("ee" + data);
>> }
>>
>> public String getAa() {
>> return aa;
>> }
>> public void setAa(String aa) {
>> this.aa = aa;
>> }
>> public String getBb() {
>> return bb;
>> }
>> public void setBb(String bb) {
>> this.bb = bb;
>> }
>> public String getCc() {
>> return cc;
>> }
>> public void setCc(String cc) {
>> this.cc = cc;
>> }
>> public String getDd() {
>> return dd;
>> }
>> public void setDd(String dd) {
>> this.dd = dd;
>> }
>> public String getEe() {
>> return ee;
>> }
>> public void setEe(String ee) {
>> this.ee = ee;
>> }
>> }
>>
>> }
>>
>>
>>
>> _______________________________________________
>> Seasar-user mailing list
>> [E-MAIL ADDRESS DELETED]
>> https://ml.seasar.org/mailman/listinfo/seasar-user
>>
>>
>
>
>--
>=============================
>Shinpei Ohtani
>[E-MAIL ADDRESS DELETED]
>=============================
Seasar-user メーリングリストの案内