Set CSS class to highlight item

5 posts, 1 answers
  1. KDL
    KDL avatar
    36 posts
    Member since:
    Aug 2005

    Posted 16 Nov 2011 Link to this post

    Hi,

    I'm trying to set the CSS class of a particular item in the rotator from code behind based on a value I obtain from the database. The following code does set the class but it sets it for a nested div and that's too deep. I need to set it on the <li> generated by the RadRotator for this item.
    Private Sub RadRotator1_ItemDataBound(sender As Object, e As Telerik.Web.UI.RadRotatorEventArgs) Handles RadRotator1.ItemDataBound
    If IsFeatured Then
    e.Item.Attributes.Add("class", "featured")
    End If
    End Sub

    The generated HTML looks like this:
    <div class="rrRelativeWrapper">
        <div class="rrClipRegion">
            <ul class="rrItemsList">
                <li class="rrItem">
                    <div id="ctl00_..._RadRotator1_i0" class="featured">

    I need my "featured" class to be injected in the <li> just above. How can I accomplish this? (Or am I going about it the wrong way?). Thanks!
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 17 Nov 2011 Link to this post

    Hello,

    You can try the following code snippet.
    VB:
    Protected Sub RadRotator1_ItemDataBound(sender As Object, e As RadRotatorEventArgs)
        Dim itm As RadRotatorItem = TryCast(e.Item, RadRotatorItem)
        Dim lbl1 As Label = TryCast(itm.FindControl("lbl"), Label)
        If lbl1.Text = "Alex" Then
            itm.CssClass = "cssitem"
        End If
    End Sub

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. KDL
    KDL avatar
    36 posts
    Member since:
    Aug 2005

    Posted 17 Nov 2011 Link to this post

    Thanks Princy, but that put the class at the same level again. Turns out it's equivalent to what I had (but more direct, using the CssClass property so good idea). So I'm still stuck on this one. I think I may need to generate JavaScript to find the parent <li> and add my class that way, just seems like there should be an easier way.
  5. Answer
    Slav
    Admin
    Slav avatar
    1356 posts

    Posted 21 Nov 2011 Link to this post

    Hi Kent,

    Indeed, in order to apply a custom CSS class to the rendered li HTML element of the RadRotator, you should utilize the Client API of the control. I have attached a sample project, implementing the suggested solution. Note that I have set the index of the modified item statically and in your actual project you will have to get it from the code behind, which can be achieved via hidden field for example.

    Please use the attached sample as a reference for your further development. Don't hesitate to contact us again if you encounter more difficulties.

    Greetings,
    Slav
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  6. KDL
    KDL avatar
    36 posts
    Member since:
    Aug 2005

    Posted 21 Nov 2011 Link to this post

    Slav, thank you very much for the great demo and explanation. Exactly what I needed.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017