Set ForeColor of AutoCompleteSuggest DropDownList

2 posts, 0 answers
  1. Clive
    Clive avatar
    12 posts
    Member since:
    Sep 2011

    Posted 30 Nov 2011 Link to this post

    Hi,

    I'm having difficulty working out how to set the colour of the items in a non-databound list, when the user types in text to bring up the autocomplete suggest mode.

    I've set the colour of the ForeColor property in the items according to a business object that is set to the Value property in each item.

    When the user hits the drop down arrow, the list populates with red and black items. However when the user types in 'L' and the list displays, I'm trying to get it to display the same black/red colours but it seems the items in the AutoCompleteSuggest.DropDownList.Items do not have their Value/Tag properties set from the original items.

    Can you suggest a work around for this?

    My experience with .Net is 7 years. My experience with Rad is about 1 month.

    OS version and applied service packs

    Microsoft Windows Server 2003, Standard Edition, Service Pack 2

    • Regional and language settings, if different from En-US

    English (Australia)

    • .NET version (.NET2, .NET3, .NET3.5)

    .NET 4.0.30319 SP1Rel, Visual Studio 2010 Version 10.0.40219.1 SP1Rel

    • Exact version of the Telerik product 

    Runtime Version v2.0.50727, Version 2011.3.11.1116

    Thanks,
    Clive

    Imports Telerik.WinControls.UI
    Public Class Form10
        Inherits System.Windows.Forms.Form
      
        'Form overrides dispose to clean up the component list.
        <System.Diagnostics.DebuggerNonUserCode()> _
        Protected Overrides Sub Dispose(ByVal disposing As Boolean)
            Try
                If disposing AndAlso components IsNot Nothing Then
                    components.Dispose()
                End If
            Finally
                MyBase.Dispose(disposing)
            End Try
        End Sub
      
        'Required by the Windows Form Designer
        Private components As System.ComponentModel.IContainer
      
        'NOTE: The following procedure is required by the Windows Form Designer
        'It can be modified using the Windows Form Designer.  
        'Do not modify it using the code editor.
        <System.Diagnostics.DebuggerStepThrough()> _
        Private Sub InitializeComponent()
            Dim RadListDataItem1 As Telerik.WinControls.UI.RadListDataItem = New Telerik.WinControls.UI.RadListDataItem()
            Dim RadListDataItem2 As Telerik.WinControls.UI.RadListDataItem = New Telerik.WinControls.UI.RadListDataItem()
            Dim RadListDataItem3 As Telerik.WinControls.UI.RadListDataItem = New Telerik.WinControls.UI.RadListDataItem()
            Dim RadListDataItem4 As Telerik.WinControls.UI.RadListDataItem = New Telerik.WinControls.UI.RadListDataItem()
            Dim RadListDataItem5 As Telerik.WinControls.UI.RadListDataItem = New Telerik.WinControls.UI.RadListDataItem()
            Me.RadDropDownList1 = New Telerik.WinControls.UI.RadDropDownList()
            Me.CheckBox1 = New System.Windows.Forms.CheckBox()
            CType(Me.RadDropDownList1, System.ComponentModel.ISupportInitialize).BeginInit()
            Me.SuspendLayout()
            '
            'RadDropDownList1
            '
            Me.RadDropDownList1.DropDownAnimationEnabled = True
            RadListDataItem1.Text = "ListItem 1"
            RadListDataItem1.Value = 1
            RadListDataItem1.Tag = 1
            RadListDataItem1.TextWrap = True
            RadListDataItem2.Text = "ListItem 2"
            RadListDataItem2.Value = 2
            RadListDataItem2.Tag = 2
            RadListDataItem2.TextWrap = True
            RadListDataItem3.Text = "ListItem 3"
            RadListDataItem3.Value = 3
            RadListDataItem3.Tag = 3
            RadListDataItem3.TextWrap = True
            RadListDataItem4.Text = "ListItem 4"
            RadListDataItem4.Value = 4
            RadListDataItem4.Tag = 4
            RadListDataItem4.TextWrap = True
            RadListDataItem5.Text = "ListItem 5"
            RadListDataItem5.Value = 5
            RadListDataItem5.Tag = 5
            RadListDataItem5.TextWrap = True
            Me.RadDropDownList1.Items.Add(RadListDataItem1)
            Me.RadDropDownList1.Items.Add(RadListDataItem2)
            Me.RadDropDownList1.Items.Add(RadListDataItem3)
            Me.RadDropDownList1.Items.Add(RadListDataItem4)
            Me.RadDropDownList1.Items.Add(RadListDataItem5)
            Me.RadDropDownList1.Location = New System.Drawing.Point(65, 40)
            Me.RadDropDownList1.Name = "RadDropDownList1"
            Me.RadDropDownList1.ShowImageInEditorArea = True
            Me.RadDropDownList1.Size = New System.Drawing.Size(106, 20)
            Me.RadDropDownList1.TabIndex = 0
            '
            'CheckBox1
            '
            Me.CheckBox1.AutoSize = True
            Me.CheckBox1.Location = New System.Drawing.Point(65, 83)
            Me.CheckBox1.Name = "CheckBox1"
            Me.CheckBox1.Size = New System.Drawing.Size(81, 17)
            Me.CheckBox1.TabIndex = 1
            Me.CheckBox1.Text = "CheckBox1"
            Me.CheckBox1.UseVisualStyleBackColor = True
            '
            'Form10
            '
            Me.AutoScaleDimensions = New System.Drawing.SizeF(6.0!, 13.0!)
            Me.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font
            Me.ClientSize = New System.Drawing.Size(292, 273)
            Me.Controls.Add(Me.CheckBox1)
            Me.Controls.Add(Me.RadDropDownList1)
            Me.Name = "Form10"
            Me.Text = "Form10"
            CType(Me.RadDropDownList1, System.ComponentModel.ISupportInitialize).EndInit()
            Me.ResumeLayout(False)
            Me.PerformLayout()
      
        End Sub
        Friend WithEvents RadDropDownList1 As Telerik.WinControls.UI.RadDropDownList
        Private Sub Form10_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
            For Each item In RadDropDownList1.Items
                item.ForeColor = If(CInt(item.Value) Mod 2 = 0, Color.Red, Color.Black)
            Next
            RadDropDownList1.AutoCompleteMode = AutoCompleteMode.SuggestAppend
            AddHandler RadDropDownList1.DropDownListElement.AutoCompleteSuggest.DropDownList.PopupOpening,
                Sub()
                    If Not CheckBox1.Checked Then Return
                    For Each item In RadDropDownList1.DropDownListElement.AutoCompleteSuggest.DropDownList.Items
                        ' can't think of a way to get the value from the original list
                        If item.Value IsNot Nothing Then
                            item.ForeColor = If(CInt(item.Value) Mod 2 = 0, Color.Blue, Color.Green)
                        ElseIf item.Tag IsNot Nothing Then
                            item.ForeColor = If(CInt(item.Tag) Mod 2 = 0, Color.Blue, Color.Green)
                        Else
                            item.ForeColor = Color.Orange
                        End If
      
                    Next
                End Sub
            AddHandler RadDropDownList1.DropDownListElement.AutoCompleteSuggest.DropDownList.ListElement.VisualItemFormatting,
                Sub(sender1 As Object, ee As VisualItemFormattingEventArgs)
                    If Not CheckBox1.Checked Then
                        ' can't find any way to get the RadDataListItem to find out the business rule to change the colour
                        ee.VisualItem.ForeColor = Color.Brown
                    End If
                End Sub
        End Sub
      
    End Class
  2. Peter
    Admin
    Peter avatar
    1148 posts

    Posted 02 Dec 2011 Link to this post

    Hello Clive,

    Thank you for writing.

    You should implement a custom AutoCompleteAppendHelper and override SyncItemsCore method:

    public class MyAutoCompleteHelper
        inherits AutoCompleteSuggestHelper
     
            sub New(owner as RadDropDownListElement)
                MyBase.new(owner)
            End Sub
            Protected overrides sub SyncItemsCore
                For i as integer = 0 to Owner.Items.Count-1
                    dim dataItem as new RadListDataItem
                    dataItem.Text = Owner.Items(i).Text
                    dataItem.Value = Owner.Items(i).Value
                    dataItem.Tag = Owner.Items(i).Tag
                    dataItem.ForeColor = If(CInt(Owner.Items(i).Value) Mod 2 = 0, Color.Red, Color.Green)
                    me.DropDownList.Items.Add(dataItem)
                Next
            End Sub
    End Class

    In this method you can copy the Value, Tag (and set the ForeColor) from the original DataItem to the AutoComplete's DataItem.

    You should change the default AutoCompleteHelper with your AutoCompleteHelper
    Private Sub Form10_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
            RadDropDownList1.AutoCompleteMode = AutoCompleteMode.SuggestAppend     
     
            me.RadDropDownList1.DropDownListElement.AutoCompleteSuggest = new MyAutoCompleteHelper(me.RadDropDownList1.DropDownListElement)

    Please refer to the attached form. I hope this helps.

    Kind regards,
    Peter
    the Telerik team

    Q3’11 of RadControls for WinForms is available for download (see what's new). Get it today.

  3. UI for WinForms is Visual Studio 2017 Ready
Back to Top