Adding indivual item background colors

6 posts, 1 answers
  1. Mark
    Mark avatar
    37 posts
    Member since:
    Jan 2015

    Posted 09 Jun 2015 Link to this post

    I have tried a few things but I am unable to get the background color to set on a rad ddl.  Here is the code I have that doesn't work:

    Method 1

    If (dr("ACTIVE")) = 0 Then
       ddlOperator.Items(ddlOperator.Items.Count - 1).Attributes.Add("style", "BACKGROUND-COLOR: Red")
    End If

     

    Method 2

    Dim itemData As New DropDownListItem
    itemData.Text = dr("NAME").ToString
    itemData.Value = dr("BADGE").ToString

    If (dr("ACTIVE")) = 0 Then
         itemData.Attributes.Add("style", "background-color: red")

    end if

  2. Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 10 Jun 2015 Link to this post

    Hi Mark,

    Thank you for contacting Telerik support.

    You can set a custom CSS class to an item and after that use it in a selector for customizing the item layout by the following:
    Dim itemData As New DropDownListItem
    itemData.CssClass = "customCss"

    then the CSS could be:
    /*normal state*/
    .customCss {
        background: red;
    }
     
    /*hover, selected state*/
    .rddlPopup .customCss.rddlItemHovered,
    .rddlPopup .customCss.rddlItemSelected {
        background: magenta;
    }


    We hope this solution will meet your expectations

    Regards,
    Magdalena
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mark
    Mark avatar
    37 posts
    Member since:
    Jan 2015

    Posted 10 Jun 2015 in reply to Magdalena Link to this post

    I think you misunderstood my question.  What I want is when I load the drop down and an item meets a criteria to turn that item red.      I don't care about hover or selected.  So for example the number represent the items in the ddl and the background color for each item:

    ddl items

    1 - background color = black

    2 - background color = red

    3 - background color = black

    4 - background color = red

    5 - background color = red

  5. Answer
    Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 12 Jun 2015 Link to this post

    Hello Mark,

    If you do not want to change hovered or selected color, simply skip the second part of the CSS code snippet.

    You can set to each item different CSS class and use it for different CSS rules.

    VB
    If (dr("ACTIVE")) = 0 Then
        itemData.CssClass = "customClass1"
    End If


    CSS
    .customClass1 {
        background: red;
    }


    Regards,
    Magdalena
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Mark
    Mark avatar
    37 posts
    Member since:
    Jan 2015

    Posted 12 Jun 2015 in reply to Magdalena Link to this post

    That didn't work.  Here is my code

    For Each dr As DataRow In dt.Rows
       Dim itemData As New DropDownListItem
       itemData.Text = dr("NAME").ToString
       itemData.Value = dr("BADGE").ToString

       If (dr("ACTIVE")) = 0 Then
         itemData.CssClass = "InactiveEmployees"
       End If
       ddlOperator.Items.Add(New DropDownListItem(dr("NAME"), dr("BADGE")))
    Next

     

    .css
    .InactiveEmployees
    {
        background: red
    }

  7. Mark
    Mark avatar
    37 posts
    Member since:
    Jan 2015

    Posted 12 Jun 2015 in reply to Mark Link to this post

    Nevermind, it did work.  This is what I did wrong:

    'ddlOperator.Items.Add(New DropDownListItem(dr("NAME"), dr("BADGE")))
    ddlOperator.Items.Add(itemData)

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017