ListViewで2個以上のテーブルにデータを分ける

ListView使用時に、テーブルを使う際、データを2つ以上のテーブルに振り分けたい!という場合のメモ。
とりあえず、以下のようにすれば複数のテーブルに格納できる。

 <asp:ListView ID="ListView1" runat="server" GroupItemCount="10">
   <LayoutTemplate>
     <div runat="server" id="groupPlaceholder">
     </div>
   </LayoutTemplate>
   <GroupTemplate>
     <table>
       <tr>
         <th>
           <span>カラム1</span>
         </th>
         <th>
           <span>カラム2</span>
         </th>
       </tr>
       <tr runat="server" id="itemPlaceholder">
       </tr>
     </table>
   </GroupTemplate>
   <ItemTemplate>
     <tr>
       <td>
         <%# Eval("data1") %>
       </td>
       <td>
         <%# Eval("data2")%>
       </td>
     </tr>
   </ItemTemplate>
 </asp:ListView>

この場合、1つのテーブルに表示されるデータは、
GroupItemCountプロパティに設定した数になるので、10行までということになる。
当然、データが21行以上ある場合は、テーブルが3つになるので注意する。

問題になるのは、以下のようなCSSを指定している場合。

 table {
   width: 50%;
   float: left;
 }

データを2つのテーブルに分けて、横に並ばせたい!
という目的でする場合、テーブルが3個以上になると悲惨なことに。
ListView自体データソースからバインドして使うので、width決めうちのfloatとは相性が良くない。
GroupItemCountの値を大きめに取るなどの対策が必要。

タグ:

Control
最終更新:2012年05月31日 19:27
ツールボックス

下から選んでください:

新しいページを作成する
ヘルプ / FAQ もご覧ください。