Custom Autocomplete on Editor

7 posts, 1 answers
  1. Marco
    Marco avatar
    87 posts
    Member since:
    Apr 2011

    Posted 07 Jun Link to this post

    Hello Telerik

    I would like to have an editor in a GridView for selecting one business object (DataBase Key, Name, Code (like an EAN CODE) in a collection. As The name is also considered to be an unique Key, the editor is based on a textbox which display the name of a product. The textbox should have a autocomplete feature (suggest with a dropdown) but the suggestion should be based on the whole list of product filtered by the Name or the Code.

    The editor is valid only if the text is matching a product name (return the matching DataBase key for the binding) or is empty (return a nullvalue for binding).

    What is the best way to reach this objectif ? Should I start from a RadDropDownListEditor, a RadTextBoxControlEditor, a RadTextBoxEditor ?

    Thanks for your support

  2. Dess
    Admin
    Dess avatar
    1609 posts

    Posted 09 Jun Link to this post

    Hello Marco,

    Thank you for writing. 

    RadGridView provides different columns types one of which is GridViewComboBoxColumn. It displays a set of predefined candidate text values in a drop down list and it is typically used to provide a lookup into some set of relatively static values. GridViewComboBoxColumn provides flexible auto-completion options that suggest and append text from choices in the list as the user types. It can be controlled by the GridViewComboBoxColumn.AutoCompleteMode property.

    I hope this information helps. Should you have further questions I would be glad to help.

    Regards,
    Dess
    Telerik
    Check out the Windows Forms project converter, which aids the conversion process from standard Windows Forms applications written in C# or VB to Telerik UI for WinForms.For more information check out this blog post and share your thoughts.
  3. UI for WinForms is Visual Studio 2017 Ready
  4. Marco
    Marco avatar
    87 posts
    Member since:
    Apr 2011

    Posted 10 Jun in reply to Dess Link to this post

    Hello Dess,

    Thank you for answering.

    I have made a custom GridViewComboBoxColum and a Custom AutoCompleteSuggestHelper according the documentation you linked.

     

    Friend Class GridViewInstrumentColumn
        Inherits GridViewComboBoxColumn
        Public Overrides Sub InitializeEditor(editor As Telerik.WinControls.UI.IInputEditor)
            MyBase.InitializeEditor(editor)
            Dim AutocompleteEditor = TryCast(editor, RadDropDownListEditor)
            If AutocompleteEditor IsNot Nothing Then
                Dim editorElement As RadDropDownListEditorElement = TryCast(AutocompleteEditor.EditorElement, RadDropDownListEditorElement)
                editorElement.AutoCompleteDataSource = Me.DataSource
                editorElement.AutoCompleteDisplayMember = "Name"
                editorElement.AutoCompleteMode = AutoCompleteMode.Suggest
                editorElement.AutoCompleteSuggest = New InstrumentAutoCompleteSuggestHelper(editorElement)
            End If
        End Sub
        Private Class InstrumentAutoCompleteSuggestHelper
            Inherits AutoCompleteSuggestHelper
            Public Sub New(owner As RadDropDownListElement)
                MyBase.New(owner)
            End Sub
            Protected Overrides Function DefaultFilter(item As Telerik.WinControls.UI.RadListDataItem) As Boolean
                Dim data As CastorModel.Instrument = TryCast(item.DataBoundItem, CastorModel.Instrument)
                If data IsNot Nothing Then
                    Return (Not IsNothing(data.Name) AndAlso data.Name.IndexOf(Me.Filter, StringComparison.CurrentCultureIgnoreCase) > -1) OrElse
                        (Not IsNothing(data.Bloomberg_Ticker) AndAlso data.Bloomberg_Ticker.IndexOf(Me.Filter, StringComparison.CurrentCultureIgnoreCase) > -1) OrElse
                        (Not IsNothing(data.ISIN) AndAlso data.ISIN.IndexOf(Me.Filter, StringComparison.CurrentCultureIgnoreCase) > -1)
                Else
                    Return MyBase.DefaultFilter(item)
                End If
            End Function

        End Class
    End Class

     

    It's look the suggestion are well filtred but I have some strange behavior on the editor. The text is mixed with a value of the datasource and my typing.

    Any idea how to avoid this ?

     

  5. Dess
    Admin
    Dess avatar
    1609 posts

    Posted 10 Jun Link to this post

    Hello Marco,

    Thank you for writing back. 

    I have succeeded to replicate the text mixing when typing. However, note that it is redundant to set the DataSource of the RadDropDownListEditorElement because it is already set to the column. When I initialize the custom column like below, the text seems to behave as expected:
    Sub New()
     
        InitializeComponent()
     
        Dim comboCol As New GridViewInstrumentColumn()
        comboCol.DataSource = Me.CategoriesBindingSource
        comboCol.DisplayMember = "CategoryName"
        comboCol.ValueMember = "CategoryID"
        comboCol.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDown
        comboCol.AutoCompleteMode = AutoCompleteMode.Suggest
        comboCol.FieldName = "CategoryID"
        comboCol.MinWidth = 300
        Me.RadGridView1.Columns.Add(comboCol)
     
        Me.RadGridView1.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill
    End Sub
     
    Friend Class GridViewInstrumentColumn
    Inherits GridViewComboBoxColumn
        Public Overrides Sub InitializeEditor(editor As Telerik.WinControls.UI.IInputEditor)
            MyBase.InitializeEditor(editor)
            Dim AutocompleteEditor = TryCast(editor, RadDropDownListEditor)
            If AutocompleteEditor IsNot Nothing Then
                Dim editorElement As RadDropDownListEditorElement = TryCast(AutocompleteEditor.EditorElement, RadDropDownListEditorElement)
                editorElement.AutoCompleteSuggest = New InstrumentAutoCompleteSuggestHelper(editorElement)
            End If
        End Sub
         
        Private Class InstrumentAutoCompleteSuggestHelper
        Inherits AutoCompleteSuggestHelper
            Public Sub New(owner As RadDropDownListElement)
                MyBase.New(owner)
            End Sub
            Protected Overrides Function DefaultFilter(item As Telerik.WinControls.UI.RadListDataItem) As Boolean
                Dim data As DataRowView = TryCast(item.DataBoundItem, DataRowView)
                If data IsNot Nothing Then
                    Return (Not IsNothing(data.Row("CategoryName")) AndAlso _
                    data.Row("CategoryName").IndexOf(Me.Filter, StringComparison.CurrentCultureIgnoreCase) > -1)
                Else
                    Return MyBase.DefaultFilter(item)
                End If
            End Function
        End Class
    End Class

    I hope this information helps. If you have any additional questions, please let me know.

    Regards,
    Dess
    Telerik
    Check out the Windows Forms project converter, which aids the conversion process from standard Windows Forms applications written in C# or VB to Telerik UI for WinForms.For more information check out this blog post and share your thoughts.
  6. Marco
    Marco avatar
    87 posts
    Member since:
    Apr 2011

    Posted 10 Jun in reply to Dess Link to this post

    Hello Dess,

    When I remove the datasource on the editorElement, the item in the RadListDataItem parameter in the DefaultFilter is not bound anymore. Then I can only access and process the custom filter with the text value. Are you sure that in your sample you don't go on MyBase.DefaultFilter(item) ?

  7. Answer
    Dess
    Admin
    Dess avatar
    1609 posts

    Posted 13 Jun Link to this post

    Hello Marco,

    Thank you for writing back. 

    Indeed, in this case, the RadListDataItem is not bound. I have modified the code snippet in a way to access the data source and find the relevant record for the filter functionality without binding the autocomplete items:
    Sub New()
        InitializeComponent()
        Dim comboCol As New GridViewInstrumentColumn()
        comboCol.DataSource = Me.CategoriesBindingSource
        comboCol.DisplayMember = "CategoryName"
        comboCol.ValueMember = "CategoryID"
        comboCol.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDown
        comboCol.AutoCompleteMode = AutoCompleteMode.Suggest
        comboCol.FieldName = "CategoryID"
        comboCol.MinWidth = 300
        Me.RadGridView1.Columns.Add(comboCol)
        Me.RadGridView1.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill
        AddHandler Me.RadGridView1.CellEditorInitialized, AddressOf CellEditorInitialized
    End Sub
     
    Private Sub CellEditorInitialized(sender As Object, e As GridViewCellEventArgs)
        Dim AutocompleteEditor = TryCast(e.ActiveEditor, RadDropDownListEditor)
        If AutocompleteEditor IsNot Nothing Then
            Dim editorElement As RadDropDownListEditorElement = TryCast(AutocompleteEditor.EditorElement, RadDropDownListEditorElement)
            editorElement.AutoCompleteMode = AutoCompleteMode.Suggest
            editorElement.AutoCompleteSuggest = New InstrumentAutoCompleteSuggestHelper(editorElement, Me.CategoriesBindingSource) 
        End If
    End Sub
     
    Private Class InstrumentAutoCompleteSuggestHelper
    Inherits AutoCompleteSuggestHelper
        Dim ds As DataSet
        Public Sub New(owner As RadDropDownListElement, dataSource As BindingSource)
            MyBase.New(owner)
            ds = dataSource.DataSource
        End Sub
        Protected Overrides Function DefaultFilter(item As Telerik.WinControls.UI.RadListDataItem) As Boolean            
            Dim data As DataRow = Nothing
            For Each row As DataRow In ds.Tables(0).Rows
                If row(Me.Owner.ValueMember) = item.Value Then
                    data = row
                End If
            Next
            If data IsNot Nothing Then
                Return (Not IsNothing(data("CategoryName")) AndAlso _
                data("CategoryName").IndexOf(Me.Filter, StringComparison.CurrentCultureIgnoreCase) > -1)
            Else
                Return MyBase.DefaultFilter(item)
            End If
        End Function
    End Class

    I hope this information helps. If you have any additional questions, please let me know.

    Regards,
    Dess
    Telerik
    Check out the Windows Forms project converter, which aids the conversion process from standard Windows Forms applications written in C# or VB to Telerik UI for WinForms.For more information check out this blog post and share your thoughts.
  8. Marco
    Marco avatar
    87 posts
    Member since:
    Apr 2011

    Posted 27 Jun in reply to Dess Link to this post

    Hello Dess

    Coming back from holiday. Adding a reference to the datasource and searching the full object from the value member is working fine.

    I hope that the extra load for searching the full object won't become a performance issue when the combobox datasource with the "real list" instead of my 10 test items.

    Thank you very much for all your support

    Marco

Back to Top
UI for WinForms is Visual Studio 2017 Ready