Click here to Skip to main content
15,885,216 members
Search within:


Articles / Web Development / HTML
 

ExCB - Extended Multi Column ComboBox

Rate me:
Please Sign up or sign in to vote.
4.77/5 (31 votes)
21 Mar 2016CPOL6 min read 77.2K   3.6K   43  
Presenting an easy-to-use, flexible, filterable ComboBox, managing various data types (including images), also sortable, resizable and reordable columns
 
Public Class Form1

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

        Players_Column_Definitions()
        Read_Players()

        Countries_Column_Definitions()
        Read_Countries()

    End Sub

#Region "Players"

    Private Sub Players_Column_Definitions()

        ' Defining Columns for Excb1 (Players):
        ' Usage:
        ' Excb1.AddColumn(HeaderText as String, [Width=80], [Align=Left], [DataType=_Text], [Format=Nothing],  
        '               [ForeColor=Nothing], [BackColor=Nothing], [ImgWidth=0], [ImgHeight=0]), [SizeMode=_Stretch], 
        '               [Resizable=True], [Reordable=True], [Sortable=True], [ArrowOnRight=False]

        ' Column 0: Player ID, not visible (width 0), numeric, not resizable, not reordable, not sortable
        Excb1.AddColumn("ID", 0, , ExCB.ExCB.DataType._Numeric, , , , , , , False, False, False)

        ' Column 1: Rank, width 50, align center, numeric, default colors
        Excb1.AddColumn("Rank", 50, HorizontalAlignment.Center, ExCB.ExCB.DataType._Numeric)

        ' Column 2: Birth Date, [width 80], align center, date, display format "dd-MM-yyyy", default colors
        Excb1.AddColumn("Birth Date", , HorizontalAlignment.Center, ExCB.ExCB.DataType._Date, "dd-MM-yyyy")

        ' Column 3: Actual age, width 50, align right, numeric, default colors, sort arrow on right
        Excb1.AddColumn("Age", 50, HorizontalAlignment.Right, ExCB.ExCB.DataType._Numeric, , , , , , , , , , True)

        ' Column 4: European Player?, width 70, align center, boolean, default colors, 
        '           checkbox default size (16x16)-as defined in the Property Sizes.YesNo_Height (16)
        Excb1.AddColumn("European", 70, HorizontalAlignment.Center, ExCB.ExCB.DataType._LogicImg)

        ' Column 5: Name, width 150, [align left], string, default colors
        Excb1.AddColumn("Name", 150)

        ' Column 6: Team, width 150, [align left], string, default colors
        Excb1.AddColumn("Team", 150)

        Excb1.DisplayColumn = 5     ' Column to display when selected (Name)

        ' Sum of widths = 570. 

    End Sub

    Private Sub Read_Players()

        ' Usually, data is read from a database, using a DataReader (DR), like:
        '
        ' While DR.Read()
        '   ... READ EACH RECORD ...
        '       ' In VS2012, this syntax is allowed:
        '   Excb1.AddRow({DR(0), DR(1), DR(2), Calc_Actual_Age(DR(2)), DR(3), DR(4)})
        '       ' meaning (database field names starting with P1_):
        '   Excb1.AddRow({P1_ID, P1_Rank, P1_Birth, Calc_Actual_Age(P1_Birth), P1_Name, P1_Team})
        '       ' In VS2008, must be like this:
        '   Excb1.AddRow(New String() {DR(0), DR(1), DR(2), Calc_Actual_Age(DR(2)), DR(3), DR(4)})
        '       ' meaning (database field names starting with P1_):
        '   Excb1.AddRow(New String() {P1_ID, P1_Rank, P1_Birth, Calc_Actual_Age(P1_Birth), P1_Name, P1_Team})
        ' End While

        ' but for now, 3 ways to Add a Row:

        ' Method 1) Building & Sending an Array

        ' Sending at least one image, the Array must be defined as Object
        ' Otherwise, using only folder/file Paths, the Array can be defined
        ' as String, for better performance (this case)

        Dim MyArray(6) As String

        MyArray(0) = 456
        MyArray(1) = 1
        MyArray(2) = DateSerial(1985, 2, 5)
        MyArray(3) = Calc_Actual_Age(MyArray(2))
        MyArray(4) = True
        MyArray(5) = "Cristiano Ronaldo"
        MyArray(6) = "Real Madrid C.F."

        Excb1.AddRow(MyArray)

        ' Method 2) Imagine reading from a Database DataReader (DR)

        Dim DR(5) As String
        DR(0) = 789
        DR(1) = 2
        DR(2) = DateSerial(1987, 6, 24)
        DR(3) = False
        DR(4) = "Lionel Messi"
        DR(5) = "F. C. Barcelona"

        Excb1.AddRow(New String() {DR(0), DR(1), DR(2), Calc_Actual_Age(DR(2)), DR(3), DR(4), DR(5)})    ' VS2008
        'Excb1.AddRow({DR(0), DR(1), DR(2), Calc_Actual_Age(DR(2)), DR(3), DR(4), DR(5)})                ' VS2012

        ' Method 3) Sending String, Date[Time], Numeric or Boolean constants, or even Images (see Countries example)

        Dim BirthDate As Date = DateSerial(1983, 4, 7)

        Excb1.AddRow(New String() {123, 3, BirthDate, Calc_Actual_Age(BirthDate), True, "Frank Ribéry", "F. C. Bayern Munchen"})     ' VS2008
        'Excb1.AddRow({123, 3, BirthDate, Calc_Actual_Age(BirthDate), True, "Frank Ribéry", "F. C. Bayern Munchen"})                 ' VS2012
    End Sub

#End Region

#Region "Selection examples"

    Private Sub CheckBox1_CheckedChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles CheckBox1.CheckedChanged
        Panel1.Visible = sender.Checked
    End Sub

    Private Sub bSelByDate_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles bSelByDate.Click
        If IsDate(tbBirth.Text) Then
            MsgBox(Excb1.RowSelect(2, CDate(tbBirth.Text), 4), , "Return Value")
        Else
            MsgBox("Not a date...")
        End If
    End Sub

    Private Sub bSelByName_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles bSelByName.Click
        MsgBox(Excb1.RowSelect(5, tbName.Text, 0), , "Return Value")
    End Sub

    Private Sub bSelByBoolean_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles bSelByBoolean.Click
        MsgBox(Excb1.RowSelect(4, cbEurop.Checked, 5), , "Ret Value")
    End Sub

    Private Sub bSelByRank_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles bSelByRank.Click
        If IsNumeric(tbRank.Text) Then
            MsgBox(Excb1.RowSelect(1, Val(tbRank.Text), 2), , "Ret Value")
        Else
            MsgBox("Not a number...")
        End If
    End Sub

    ' Example of using Event "ItemSelected"
    'Private Sub Excb1_ItemSelected(ByVal ItemArray As System.Array, ByVal Index As Integer) Handles Excb1.ItemSelected
    '    MsgBox("Name: " & ItemArray(5).ToString & vbCr & _
    '           "Index: " & Index.ToString, , "Just Selected")
    'End Sub

#End Region

#Region "Countries"

    Private Sub Countries_Column_Definitions()

        ' Defining Columns for Excb2 (Countries):
        ' Usage:
        ' Excb2.AddColumn(HeaderText as String, [Width=80], [Align=Left], [DataType=Text], [Format=Nothing],  
        '               [ForeColor=Nothing], [BackColor=Nothing], [ImgWidth=0], [ImgHeight=0]), [SizeMode=_Stretch], 
        '               [Resizable=True], [Reordable=True], [Sortable=True], [ArrowOnRight=False]

        ' Column 0: Country, width 100, all other defaults
        Excb2.AddColumn("Country", 100)

        ' Column 1: Phone Code, not visible (width 0), not resizable, not reordable, not sortable
        Excb2.AddColumn("Phone Code", 0, , , , , , , , , False, False, False)

        ' Column 2: Flag, width 60, align center, image, default sizes (24x16)-as defined in the 
        '           Properties(Sizes.Image_Height(16) and Sizes.Image_Width(24))
        Excb2.AddColumn("Flag", 60, HorizontalAlignment.Center, ExCB.ExCB.DataType._Image)

        ' Column 3: European Union?, width 60, align center, boolean, checkbox forecolor Blue,
        '           checkbox size 13x13 (Property Sizes.YesNo_Height (13))
        Excb2.AddColumn("E.U.", 60, HorizontalAlignment.Center, ExCB.ExCB.DataType._LogicTxt, , Excb1.ARGB(Color.Blue))

        ' Column 4: Euro currency?, width 60, align center, boolean, checkbox forecolor Green,
        '           checkbox size 13x13 (Property Sizes.YesNo_Height (13))
        Excb2.AddColumn("Euro", 60, HorizontalAlignment.Center, ExCB.ExCB.DataType._LogicImg, , Excb1.ARGB(Color.Green))

        ' Column 5: NATO country?, width 60, align center, boolean, checkbox forecolor Red,
        '           checkbox size 13x13 (Property Sizes.YesNo_Height (13))
        Excb2.AddColumn("NATO", 60, HorizontalAlignment.Center, ExCB.ExCB.DataType._LogicTxt, , Excb1.ARGB(Color.Red))

        ' Column 6: Commonwealth country?, width 110, align center, boolean, checkbox forecolor Maroon,
        '           checkbox size 13x13 (Property Sizes.YesNo_Height (13))
        Excb2.AddColumn("Commonwealth", 110, HorizontalAlignment.Center, ExCB.ExCB.DataType._LogicImg, , Excb1.ARGB(Color.Maroon))

        ' Column 7: Language spoken, width 100, all other defaults
        Excb2.AddColumn("Language", 100)

        Excb2.DisplayColumn = 0     ' Column to display when selected (Name)

        ' Sum of widths = 550. 

    End Sub

    Private Sub Read_Countries()

        Dim FlagImage As Image  ' Images are to be read from files (could also be read from a database)
        '                       ' and sent to the control as images

        Dim Record(7) As Object
        ' Sending at least one image, the Array must be defined as Object (this case)
        ' Otherwise, using only folder/file Paths, the Array can be defined
        ' as String, for better performance

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\UK.PNG")
        Record(0) = "UK"
        Record(1) = "+44"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = False
        Record(5) = True
        Record(6) = True
        Record(7) = "English"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\USA.PNG")
        Record(0) = "USA"
        Record(1) = "+1"
        Record(2) = FlagImage
        Record(3) = False
        Record(4) = False
        Record(5) = True
        Record(6) = False
        Record(7) = "English"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Brazil.PNG")
        Record(0) = "Brazil"
        Record(1) = "+55"
        Record(2) = FlagImage
        Record(3) = False
        Record(4) = False
        Record(5) = False
        Record(6) = False
        Record(7) = "Portuguese"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Turkey.PNG")
        Record(0) = "Turkey"
        Record(1) = "+90"
        Record(2) = FlagImage
        Record(3) = False
        Record(4) = False
        Record(5) = True
        Record(6) = False
        Record(7) = "Turkish"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Spain.PNG")
        Record(0) = "Spain"
        Record(1) = "+34"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = True
        Record(5) = True
        Record(6) = False
        Record(7) = "Spanish"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Poland.PNG")
        Record(0) = "Poland"
        Record(1) = "+48"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = False
        Record(5) = True
        Record(6) = False
        Record(7) = "Polish"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Sweden.PNG")
        Record(0) = "Sweden"
        Record(1) = "+46"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = False
        Record(5) = False
        Record(6) = False
        Record(7) = "Swedish"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Australia.PNG")
        Record(0) = "Australia"
        Record(1) = "+61"
        Record(2) = FlagImage
        Record(3) = False
        Record(4) = False
        Record(5) = False
        Record(6) = True
        Record(7) = "English"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Germany.PNG")
        Record(0) = "Germany"
        Record(1) = "+49"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = True
        Record(5) = True
        Record(6) = False
        Record(7) = "German"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\France.PNG")
        Record(0) = "France"
        Record(1) = "+33"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = True
        Record(5) = True
        Record(6) = False
        Record(7) = "French"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Portugal.PNG")
        Record(0) = "Portugal"
        Record(1) = "+351"
        Record(2) = FlagImage
        Record(3) = True
        Record(4) = True
        Record(5) = True
        Record(6) = False
        Record(7) = "Portuguese"
        Excb2.AddRow(Record)

        FlagImage = Image.FromFile(Application.StartupPath & "\Images\Argentina.PNG")
        Record(0) = "Argentina"
        Record(1) = "+54"
        Record(2) = FlagImage
        Record(3) = False
        Record(4) = False
        Record(5) = False
        Record(6) = False
        Record(7) = "Spanish"
        Excb2.AddRow(Record)

    End Sub

#End Region

#Region "ItemSelected Event"

    Private LastSelectedFlagIndex As Integer = -1

    Private Sub Excb2_ItemSelected(ByVal ItemArray As System.Array, ByVal Index As Integer) Handles Excb2.ItemSelected
        Label11.Text = ItemArray(1) ' (1)-Index of the Column (SubItem) "Phone Code"
        LastSelectedFlagIndex = ItemArray(2) ' (2)-Index of the Column (SubItem) "Flag"
    End Sub

#End Region

#Region "Get/Set Text/Index"

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim Fx As New Form2
        Fx.ShowDialog()
        Fx.Dispose()
    End Sub

    Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
        MsgBox(Excb2.Text, , "Text")
    End Sub

    Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click
        Excb2.Text = TextBox1.Text
    End Sub

    Private Sub Button5_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button5.Click
        MsgBox(Excb2.SelectedIndex.ToString, , "Selected Index")
    End Sub

    Private Sub Button4_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button4.Click
        Excb2.SelectedIndex = Val(TextBox2.Text)
    End Sub

    Private Sub Button6_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button6.Click
        PictureBox1.Image = Excb2.GetImage(LastSelectedFlagIndex)
    End Sub

#End Region

End Class

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Avelino Ferreira
Retired
Portugal Portugal
Working on computers since Mar,6 1969
Languages: RPN, Fortran, COBOL, Univac 1100 Meta-assembler, Basic, Z80 Assembly, 8086 Assembly, IBM Assembler (360/370, 38xx, 43xx), Clipper, ANSI C, SQL, Visual Basic, VBA, VB.NET
Lately, some HTML, JavaScript, C#
Actually retired, but still developing (for pleasure).

Comments and Discussions

Permalink
Advertise
Privacy
Cookies
Terms of Use
Layout: fixed | fluid

Posted 3 Jun 2014

Article Copyright 2014 by Avelino Ferreira
Everything else Copyright © CodeProject, 1999-2024

Web02 2.8:2024-04-02:1