CSS of tag, within a Repeater ItemTemplate

Discussion in 'ASP .Net' started by JJ, Apr 3, 2007.

  1. JJ

    JJ Guest

    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
     
    JJ, Apr 3, 2007
    #1
    1. Advertising

  2. JJ

    dtarczynski Guest

    On 3 Kwi, 15:36, "JJ" <> wrote:
    > 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?


    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>
     
    dtarczynski, Apr 3, 2007
    #2
    1. Advertising

  3. JJ

    JJ Guest

    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.

    "dtarczynski" <> wrote in message
    news:...
    > On 3 Kwi, 15:36, "JJ" <> wrote:
    >> 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?

    >
    > 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>
    >
    >
     
    JJ, Apr 3, 2007
    #3
  4. JJ

    bruce barker Guest

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

    -- bruce (sqlwork.com)

    JJ wrote:
    > 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
    >
    >
     
    bruce barker, Apr 3, 2007
    #4
  5. JJ

    Evan M. Guest

    On Apr 3, 11:28 am, bruce barker <> wrote:
    > add an id and runat=server on the <li> then you can use Item.FindControl
    > from the onitemdatbound event.
    >
    > -- bruce (sqlwork.com)
    >
    >
    >
    > JJ wrote:
    > > 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- Hide quoted text -

    >
    > - Show quoted text -


    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>
     
    Evan M., Apr 3, 2007
    #5
  6. JJ

    JJ Guest

    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." <> wrote in message
    news:...
    > On Apr 3, 11:28 am, bruce barker <> wrote:
    >> add an id and runat=server on the <li> then you can use Item.FindControl
    >> from the onitemdatbound event.
    >>
    >> -- bruce (sqlwork.com)
    >>
    >>
    >>
    >> JJ wrote:
    >> > 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- Hide quoted text -

    >>
    >> - Show quoted text -

    >
    > 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>
    >
     
    JJ, Apr 5, 2007
    #6
  7. JJ

    JJ Guest

    Sorry - one more question:
    What type would I cast the <li> control to be able to set its css class?
    JJ

    "bruce barker" <> wrote in message
    news:...
    > add an id and runat=server on the <li> then you can use Item.FindControl
    > from the onitemdatbound event.
    >
    > -- bruce (sqlwork.com)
    >
    > JJ wrote:
    >> 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
     
    JJ, Apr 5, 2007
    #7
  8. JJ

    Evan M. Guest

    On Apr 5, 5:56 am, "JJ" <> wrote:
    > Sorry - one more question:
    > What type would I cast the <li> control to be able to set its css class?
    > JJ
    >
    > "bruce barker" <> wrote in message
    >
    > news:...
    >
    >
    >
    > > add an id and runat=server on the <li> then you can use Item.FindControl
    > > from the onitemdatbound event.

    >
    > > -- bruce (sqlwork.com)

    >
    > > JJ wrote:
    > >> 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- Hide quoted text -

    >
    > - Show quoted text -


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

    Evan M.
     
    Evan M., Apr 10, 2007
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Bennett Haselton
    Replies:
    1
    Views:
    5,344
    Joe Fallon
    Sep 24, 2004
  2. Shimon Sim

    Repeater.ItemTemplate =?

    Shimon Sim, Jan 27, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    958
    Karl Seguin
    Jan 27, 2005
  3. shruds
    Replies:
    1
    Views:
    836
    John C. Bollinger
    Jan 27, 2006
  4. HockeyFan
    Replies:
    2
    Views:
    408
    HockeyFan
    Dec 7, 2006
  5. AC [MVP MOSS]
    Replies:
    2
    Views:
    536
    AC [MVP MOSS]
    Feb 13, 2007
Loading...

Share This Page