CSS of tag, within a Repeater ItemTemplate

  • Thread starter Thread starter JJ
  • Start date Start date
J

JJ

I'm sure this is quite simple, but clearly not for me today:

How do you set the CSS Style of a tag in a repeater Item Template?

e.g. I have this repeater:

<asp:Repeater runat="server" ID="rpt_SubCategoryList"
OnItemCreated="rpt_SubCategoryList_ItemCreated">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li><a href=' '>Some Text Here</a></li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>


....and I want to change the class of the '<li>' tag in the ItemTemplate
based on a query string setting:


protected void rpt_SubCategoryList_ItemCreated(Object Sender,
RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==
ListItemType.AlternatingItem)
{
//if current query string is x and is the same as
the current repeater item ID then
// set the cssclass of the ItemTemplate's <li> tag
to "myCssClass"


}

}

I am not sure how I access the itemTemplate's tags?

Thanks in advance

JJ
 
I'm sure this is quite simple, but clearly not for me today:

How do you set the CSS Style of a tag in a repeater Item Template?
Click to expand...

Maybe try this:

<asp:Repeater runat="server" ID="rpt_SubCategoryList"
OnItemCreated="rpt_SubCategoryList_ItemCreated">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li class="yourCSSClass"><a href=' '>Some Text Here</a></li>
<-----------------
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
 
Sorry I should have worded that differently:

How do I _change_ the css class of the tag.

Basically the css class of the tag in the repeater item needs to be
programmatically set whenever the repeater loads.
 
add an id and runat=server on the <li> then you can use Item.FindControl
from the onitemdatbound event.

-- bruce (sqlwork.com)
 
add an id and runat=server on the <li> then you can use Item.FindControl
from the onitemdatbound event.

-- bruce (sqlwork.com)











- Show quoted text -
Click to expand...

Haven't tried it myself to varify that it works, but instead of usign
a runat="server" and having code behind, if the CSS class is coming
from a query string, why not try using some inline scripting on the
page, as shown:
<asp:Repeater runat="server" ID="rpt_SubCategoryList"
OnItemCreated="rpt_SubCategoryList_ItemCreated">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li class="<%= Page.Request.QueryString["MyCssClass"] %>"><a
href=' '>Some Text Here</a></li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
 
Thanks - both interesting approaches.

As the querystring isn't the _actual_ css class (the css class merely
changes depending on various caculations to do with the value of the
querystring) using the 'runat=server' method seems the more simpl approach
here.

I've never though of setting the css class with inline scripting as you
suggest though - I am sure it will be a useful method I will experment with
with other applications - thanks


Evan M. said:
add an id and runat=server on the <li> then you can use Item.FindControl
from the onitemdatbound event.

-- bruce (sqlwork.com)











- Show quoted text -
Click to expand...

Haven't tried it myself to varify that it works, but instead of usign
a runat="server" and having code behind, if the CSS class is coming
from a query string, why not try using some inline scripting on the
page, as shown:
<asp:Repeater runat="server" ID="rpt_SubCategoryList"
OnItemCreated="rpt_SubCategoryList_ItemCreated">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li class="<%= Page.Request.QueryString["MyCssClass"] %>"><a
href=' '>Some Text Here</a></li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
Click to expand...
 
Sorry - one more question:
What type would I cast the <li> control to be able to set its css class?
JJ
 
Sorry - one more question:
What type would I cast the <li> control to be able to set its css class?
JJ








- Show quoted text -
Click to expand...

Since you just want access to the attributes collection, I'd use the
HtmlGenericControl class.

Evan M.
 
Back
Top