DataList formatting question 1

[LV]

I have a DataList that generates two columns:

<asp:DataList ID="myList" runat="server" DataKeyField="ID" RepeatColumns="2" RepeatDirection="Horizontal" RepeatLayout="flow" Width="100%">

The output looks like this:

Alaska [checkbox] Kentucky [checkbox]
Arizona [checkbox] Maine [checkbox]
Arkansas [checkbox] Michigan [checkbox]
...... .......

Each of the two columns need to have its own heading:

State Active State Active

Any ideas?

 

[BoulderBum]

Hey Lev! Funny meeting you here.

What if you set your RepeatLayout to "Table", then had something like this in the ItemTemplate and HeaderTemplate:

<div style="float: left; width: 50%">
    [state name]
</div>
<div style="float: left; width: 50%">
    [checkbox]
</div>

...where you have the proper heading instead of a state name or checkbox in the case of the header column. It's not ideal in terms of elegance, but it's a solution that should render properly across browsers even if you decide to change the number of columns.

 

[LV]

Hey man, thanks for the post! However, here is the thing: I have RepeatColumns="3" in the DataList, which builds 3 columns. The header though repeats only once for all three columns, like this:

State Active
----- ------
State1 [chk] State2 [chk] State3 [chk]
State4 [chk] State5 [chk] State6 [chk]

I came up with a solution, but it would be interesting to see what you think about it.

 

[BoulderBum]

Really?!? I figured it would repeat too! I guess I've never actually had to use the header of a DataList. :-\

Anyway, I guess the quick-and-easy way would be to do something like this in ItemDataBound:

//NOTE: not sure if this actually works.
if (e.Item.ItemType == ListItemType.Header)
                for (int i = 0; i < myList.RepeatColumns; i++)
                    e.Item.Controls.Add(new Literal("div stuff"));

...presuming you were only using the control for that page. What did you end up doing, out of curiosity?

 

[LV]

Almost the same idea, although it seems more complex and I need to try your way as well:

<asp:DataList>
  <HeaderTemplate>
    <table>
      <tr>
  </HeaderTemplate> 
      <ItemTemplate>
         <td>
           <table>
             <tr id="trHeader" runat="server">
               <td>On</td>
               <td>Preselect</td>
             </tr>
             <tr>
                <td>
                  <asp:CheckBox ID="chkOptionOn" runat="server" />
                </td>
              </tr>
             </table>
           </td>
         </ItemTemplate>
         <FooterTemplate>
              </tr>
            </table>
          </FooterTemplate>
</asp:DataList>

In ItemDataBound:

DataList dlParent = sender as DataList;
int colCount = dlParent.RepeatColumns;

HtmlTableRow tr = e.Item.FindControl("trHeader") as HtmlTableRow;
if ((e.Item.ItemIndex - colCount) >= 0)
{
  tr.Visible = false;
}

 

[BoulderBum]

I see, but how do you get the header text to repeat three times?

Oh, and as an addendum to my last post, you'd probably need to have an existing Literal control in the HeaderTemplate then add to its Text property in the loop (so it maintains state across PostBacks), but I'm sure you got the jist.