開発

13

GridViewに てこずる の巻~解決編~

12月
No Comments   Posted by tekuteku |  Category:開発

長らく更新が滞って申し訳ありません。
解決をUPしていないことにようやく気づいたため(汗)UPしますね。

ポイントは、列をTemplateFieldにすることと、ItemTemplateの中にテーブルを配置することでした。

■実現したいこと
ヘッダに2行表示、明細行に2行表示

    Header1           | Header2-1 | Header3
                                | Header2-2 |        
—————————————————-
data1    data1-2 | data2-1       | data3
    data1-3            | data2-2       |

#以下、全てGridViewのColumnsタグ内の記述です。

【Header1,data1-1~data1-3の表示】
・列をTemplateFieldにする
・aspxの「ソース」を表示して、ItemTemplateタグの中に希望の表示形式になるようテーブルを作成
・テーブルの1行目のbottom線をのみ表示して、1行目と2行目の境をつくる

[例]
※TextBox3は、DBから取得してセットした値「IRO」を初期表示する場合の記述方法です

                    <asp:TemplateField HeaderStyle-HorizontalAlign=”Center” 
                        HeaderStyle-Width=”250px” HeaderText=”Header1″>
                        <ItemTemplate>
                            <table style=”width:250px;”>
                                <tr>
                                    <td style=”border-bottom-style: solid; border-bottom-width: 1px;”>
                                        <asp:TextBox ID=”TextBox3″ runat=”server” Text=’<%# Eval(“IRO”) %>’ 
                                            Width=”50px”></asp:TextBox>
                                        <asp:TextBox ID=”TextBox4″ runat=”server” Width=”150px”></asp:TextBox>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:TextBox ID=”TextBox5″ runat=”server” Width=”210px”></asp:TextBox>
                                    </td>
                                </tr>
                            </table>
                        </ItemTemplate>
                        <HeaderStyle HorizontalAlign=”Center” Width=”250px” />
                    </asp:TemplateField>

【Header2-1~2-2,data2-1~data2-2の表示】
・列をTemplateFieldにする
・aspxの「ソース」を表示して、ItemTemplateタグの中に希望の表示形式になるようテーブルを作成
・テーブルの1行目のbottom線をのみ表示して、1行目と2行目の境をつくる

[例]
                    <asp:TemplateField HeaderText=”Header2″ ItemStyle-Width=”100px”>
                        <HeaderTemplate>
                            <table style=”width:100%;”>
                                <tr>
                                    <td style=”border-bottom-style: solid; border-bottom-width: 1px;”>
                                        Header2-1</td>
                                </tr>
                                <tr>
                                    <td>
                                        Header2-2</td>
                                </tr>
                            </table>
                        </HeaderTemplate>
                        <ItemTemplate>
                            <table>
                                <tr>
                                    <td style=”border-bottom-style: solid; border-bottom-width: 1px;”>
                                        <asp:TextBox ID=”TextBox1″ runat=”server”></asp:TextBox>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:TextBox ID=”TextBox2″ runat=”server”></asp:TextBox>
                                    </td>
                                </tr>
                            </table>
                        </ItemTemplate>
                        <ItemStyle Width=”100px” />
                    </asp:TemplateField>

                    <asp:TemplateField HeaderText=”ITEM4″ ItemStyle-Width=”200px”>
                        <ItemTemplate>
                        </ItemTemplate>
                        <ItemStyle Width=”200px” />
                    </asp:TemplateField>

【Header3,data3の表示】
・列をTemplateFieldにする
・ItemTemplateの中にTextBoxを配置

[例]
                    <asp:TemplateField HeaderText=”Header3″ ItemStyle-Width=”200px”>
                        <ItemTemplate>
                            <asp:TextBox ID=”TextBox7″ runat=”server”></asp:TextBox>
                        </ItemTemplate>
                        <ItemStyle Width=”200px” />
                    </asp:TemplateField>

more...
18

GridViewに てこずる の巻~その後~

12月
No Comments   Posted by tekuteku |  Category:開発

解決しました~~~!!!

時間ができたときに方法をUPします(多分・・・)

 

■ 2010/12/13

解決編を書きました→ こちら

more...
 | Tags: , ,
05

GridViewに てこずる の巻

12月
No Comments   Posted by tekuteku |  Category:開発

今回、初めてASP.NETを使って開発しとります。
VB.NETもろくに使ったことないのに・・・。

検索条件を入力
⇒「検索」ボタンクリックで検索処理実行
⇒取得したデータをGridViewに表示
ってしたい
で、手こずっていることをあげてみる。

・GridViewでヘッダを2行で表示する
・GridViewで1レコードのデータを2行で表示する(2行で1セットね)

こんな感じにしたいのです↓

ヘッダ1|ヘッダ2|ヘッダ3|
   ヘッダ4   |     |
——————————-
項目1 |項目2 |項目3 |
   項目4    |     |
GridViewのPreRenderイベントでヘッダを追加したり、
列を非表示にしたり、colspan設定したりして
なんとか検索処理直後の見た目はOK!

が、実は項目3はボタンでして、これをクリックすると再度PreRenderが発生してしまうです。
2回目以降にヘッダを追加すると、なぜかデータの先頭行が消える・・・。
どうやら追加したヘッダの2行目がデータの1行目にかぶさってしまってる?みたい??
そんなわけでデータ行1行目が消えてしまいます。
項目3のボタンをクリックするたびに、データが減っていくという・・。

現象を回避できないかやってみたよ。

2回目以降のPreRenderではヘッダ追加処理を通さない
⇒ヘッダが2行にならないのでアウト。

RowDataBoundで空データ行を先頭に追加
⇒やっぱりデータ行1行目が消えちゃっててアウト。
(空データ行はちゃんと追加されてる)

こまった・・・・
ネットで検索したところ、やっぱりヘッダを2行にすると行のインデックスが
おかしくなるみたいなことが書いてあって、で、その対策は?というとウヤムヤだったりして。

よい方法をご存知でしたら教えてくださーーーーいぃ。

 

■ 2010/12/13

解決編を書きました→ こちら

more...
 | Tags: , ,