Complex DataList formatting with a <table>

[Leo Duran]

Hi,

I am working on an app right now that makes extensive use of the DataList
control. I chose the DataList because I need to do multi row formatting. I
am using it like so.

<DataList id="test" runat="server>

<HeaderTemplate>

<table>

<tr>

<td>

First Name

</td>

<td>

Last Name

</td>

</tr>

<tr>

<td colspan=2>

Address

</td>

</tr>

</HeaderTemplate>

<ItemTemplate>

<tr>

<td>

DataBinder.Eval code..

</td>

<td>

DataBinder.Eval code..

</td>

</tr>

<tr>

<td colspan=2>

DataBinder.Eval code..

</td>

</tr>

</ItemTemplate>

<FooterTemplate>

</table>

</FooterTemplate>

</DataList>

For simplicities sake I left out quite a few controls. Because I am
overlapping the <table> tags with the Item Template, Footer Template, and
Header Template, the <SelectedItemStyle> formatting isn't working after I
select one of the rows. If I make the <ItemTemplate> have a nested
<table></table> tag without overlapping the Header, Item, and Footer
Templates, the <SelectedItemStyle> works fine. However, I am doing it this
way because I need the table rows to line up between the header and items.

I found a way to work around the SelectedItemStyle problem. I capture the
ItemCommand event of the DataList, and I use the following code to highlight
the selected item.

foreach(Control ctrl in e.item.controls)

{

if(ctrl is LiteralControl)

{

((LiteralControl)ctrl).Text =
((LiteralControl)ctrl).Text.Replace("<tr>", "<tr bgcolor=\"Gold\"");

}

}

It works for the most part, however, when I select another element on the
page that causes a postback, the SelectedItem looses its highlighting as the
page re-draws.

Any ideas?

[Ryan]

One thing I have found in my reading is that the order of
your templates is important. I don't remember the exact
order but I do remember that the header template comes
first followed by the footer template and then any other
templates you want to set up.

-----Original Message-----
Hi,

I am working on an app right now that makes extensive use of the DataListcontrol. I chose the DataList because I need to do multi row formatting. Iam using it like so.

<DataList id="test" runat="server>

<HeaderTemplate>

<table>

<tr>

<td>

First Name

</td>

<td>

Last Name

</td>

</tr>

<tr>

<td colspan=2>

Address

</td>

</tr>

</HeaderTemplate>

<ItemTemplate>

<tr>

<td>

DataBinder.Eval code..

</td>

<td>

DataBinder.Eval code..

</td>

</tr>

<tr>

<td colspan=2>

DataBinder.Eval code..

</td>

</tr>

</ItemTemplate>

<FooterTemplate>

</table>

</FooterTemplate>

</DataList>

For simplicities sake I left out quite a few controls. Because I amoverlapping the <table> tags with the Item Template, Footer Template, andHeader Template, the <SelectedItemStyle> formatting isn't working after Iselect one of the rows. If I make the <ItemTemplate> have a nested<table></table> tag without overlapping the Header, Item, and FooterTemplates, the <SelectedItemStyle> works fine. However, I am doing it thisway because I need the table rows to line up between the header and items.
I found a way to work around the SelectedItemStyle problem. I capture theItemCommand event of the DataList, and I use the following code to highlightthe selected item.

foreach(Control ctrl in e.item.controls)

{

if(ctrl is LiteralControl)

{

((LiteralControl)ctrl).Text =
((LiteralControl)ctrl).Text.Replace("<tr>", "<tr bgcolor=\"Gold\"");
}

}

It works for the most part, however, when I select another element on thepage that causes a postback, the SelectedItem looses its highlighting as thepage re-draws.

Any ideas?
.

[MSFT]

Hi Leo,

I think you may consider adding the style to <tr> tag in the SelectedItem
template. For example:
<SelectedItemTemplate >
<tr bgcolor=Yellow>
<td></td>
<td>
<asp:Label id="ItemLabel" Text='<%# DataBinder.Eval(Container.DataItem,
"Item") %>' runat="server"/>
</td>
<td>
<asp:Label id="QtyLabel" Text='<%# DataBinder.Eval(Container.DataItem,
"Qty") %>' runat="server"/>
</td>
<td>
<asp:Label id="PriceLabel" Text='<%# DataBinder.Eval(Container.DataItem,
"Price", "{0:c}") %>' runat="server"/>
</td>
</tr>
</SelectedItemTemplate>

This also can make the selected Item has yellow backgroud

Luke
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)