Creating alternate row background colors

9 posts, 0 answers
  1. Online .Net Developers
    Online .Net Developers avatar
    16 posts
    Member since:
    Jan 2008

    Posted 15 Jan 2009 Link to this post

    I would like to style the combobox dropdown field to mimic the alternate row colors of a grid (i.e. each line alternating between white and light grey). Is this possible?
  2. Serrin
    Serrin avatar
    286 posts
    Member since:
    Sep 2008

    Posted 15 Jan 2009 Link to this post

    Hey Devs,

    This is a kinda simple example which populates a combo with ten items, but it provides a new backcolor for even rows:

        protected void MakeCombo_Click(object sender, EventArgs e)  
        {  
            for (int x = 0; x < 10; x++)  
            {  
                RadComboBoxItem rcbi = new RadComboBoxItem();  
                rcbi.Text = "Item " + x.ToString();  
                rcbi.Value = "Item" + x.ToString();  
                if (x % 2 == 0)  
                    rcbi.BackColor = Color.LightGray;  
                RadCombo1.Items.Add(rcbi);  
            }  
        } 

    In theory you could use the same kinda logic after it's been databound (i.e., foreach RadComboItem b in RadCombo1.Items), just using it's position in the list to add a little color.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Online .Net Developers
    Online .Net Developers avatar
    16 posts
    Member since:
    Jan 2008

    Posted 15 Jan 2009 Link to this post

    Hi, thanks for the helpful reply.

    We were hoping there would be a solution using styles and skinning. Is there a way to modify the CSS to create the alternating row colors?

    Thanks again
  5. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 15 Jan 2009 Link to this post

    Hi Online .Net Developers,

    RadComboBox does not have built-in support for alternating items in the skins.

    All the best,
    Albert
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Online .Net Developers
    Online .Net Developers avatar
    16 posts
    Member since:
    Jan 2008

    Posted 16 Jan 2009 Link to this post

    Thanks for the help. We'd like to suggest this type of modification be incorporated in future releases.
  7. Jon Shipman
    Jon Shipman avatar
    43 posts
    Member since:
    Nov 2009

    Posted 30 Nov 2009 Link to this post

    Here's some code based on Serrin's suggestion.  However if you use the CssClass instead of the BackColor property the user will retain the highlighted/hover color.


    ASPX

    <telerik:RadComboBox ID="RadComboBox1" 
        runat="server" 
        ondatabound="RadComboBox1_DataBound"
    </telerik:RadComboBox> 



    C#

        protected void RadComboBox1_DataBound(object sender, EventArgs e) 
        { 
            foreach (RadComboBoxItem rcbi in RadComboBox1.Items) 
            { 
                if (rcbi.Index % 2 == 0) 
                    rcbi.CssClass = "comboBoxListItem"
                else 
                    rcbi.CssClass = "alternatingComboBoxListItem"
            } 
        } 


    CSS

    .comboBoxListItem 
        background-color#C9F1FA
     
    .alternatingComboBoxListItem 
        background-color#FFF

  8. Guy
    Guy avatar
    10 posts
    Member since:
    Mar 2009

    Posted 25 Feb 2015 in reply to Jon Shipman Link to this post

    You can also do it in the ItemDataBound event, then you don't have to itterate (VB.Net code ...)

    If e.Item.Index Mod 2 = 0 Then
    e.Item.CssClass = "comboBoxListItem"
    Else
    e.Item.CssClass = "alternatingComboBoxListItem"
    End If
  9. Keith Blackman
    Keith Blackman avatar
    5 posts
    Member since:
    Dec 2009

    Posted 07 May 2015 in reply to Guy Link to this post

    I have successfully used Guy's example on a statically created RadComboBox but am struggling to do the same for a dynamically created one. I have successfully added an event handler for the SelectedIndexChanged event but I am struggling with adding one to the ItemDataBound event.

    When I create the RadComboBox dynamically I add a handler for the SelectedIndexChanged event like this

    AddHandler MyRadComboBox(intRow).SelectedIndexChanged, AddressOf MyRadComboBoxSelectedIndexChanged
    My sub  is:

    Private Sub MyRadComboBoxSelectedIndexChanged(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs)

    So for the ItemDataBound event I feel I should add the handler like this:

    AddHandler MyRadComboBox(intRow).ItemDataBound, AddressOf MyRadComboBoxItemDataBoundAlternateShading

    and create a sub like this:

    Private Sub MyRadComboBoxItemDataBoundAlternateShading(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadComboBox????????)

            If e.Index Mod 2 = 0 Then
                e.CssClass = "RadComboBoxListItem"
            Else
                e.CssClass = "RadComboBoxListItemAlternate"
            End If
        End Sub

    But I can't find the desired event (the question marks).

    Do I need a different approach for this?

     

  10. Dimitar
    Admin
    Dimitar avatar
    281 posts

    Posted 12 May 2015 Link to this post

    Hi,

    The event arguments type is RadComboBoxItemEventArgs, as specified in the ItemDataBound help article.

    Regards,
    Dimitar
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

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