Set ForeColor of AutoCompleteSuggest DropDownList

[Clive]

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

[Peter]

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