Introduction:

Recently, in our project we wanted to allow the user to select multiple values in a list. But the list should be populated inside a grid row. So we don't want to use a listbox and also we are not interested in third-party tools. Instead of that, we wanted to use a multiselect combobox. When I browsed through various blogs, forums, etc. I got some good code, but none of them are easy for me to understand and implement so I decided to move with something bit tricky but easy for you. In short, below you will find a MultiSelect Combobox with Search feature on elements.

Using the code:

In the the below screen shots you will see I used a Listbox control to demonstrate the selected elements in Multiselect ComboBox.

main

In the below image you will see how the search feature is working; it doesn’t affect the selected elements but will manage the display of the elements; when search text was removed all Selected elements will come back into the List.

list

For better understanding I am going to split the article into two parts now :

  1. XML or designing Part
  2. C# part

To define the design part I used two controls, Dropdown for selection, and one Listbox just to display selected countries.

  1. <ComboBox Height="30" TextBoxBase.TextChanged="ddlCountry_TextChanged" HorizontalAlignment="Left" VerticalAlignment="Top" Name="ddlCountry" IsEditable="True" IsTextSearchEnabled="True" StaysOpenOnEdit="True" Width="165" SelectionChanged="ddlCountry_SelectionChanged" Margin="78,139,0,0">
  2. <ComboBox.ItemTemplate>
  3. <DataTemplate>
  4. <CheckBox Name="chkCountry" Width="220" Checked="AllCheckbocx_CheckedAndUnchecked" Unchecked="AllCheckbocx_CheckedAndUnchecked" Content="{Binding Country_Name}" IsChecked="{Binding Check_Status}" CommandParameter="{Binding Country_ID}">
  5. </CheckBox>
  6. </DataTemplate>
  7. </ComboBox.ItemTemplate>
  8. </ComboBox>
  10. <ListBox Name="testListbox" HorizontalAlignment="Left" Height="161" Margin="370,80,0,0" VerticalAlignment="Top" Width="100" />
To Bind the Multiselect Combobox ddlCountry I created a class with three properties. In the the Check_Status is basically used to identify selected items.
  1. public class DDL_Country
  2. {
  3. public int Country_ID
  4. {
  5. get;
  6. set;
  7. }
  8. public string Country_Name
  9. {
  10. get;
  11. set;
  12. }
  13. public Boolean Check_Status
  14. {
  15. get;
  16. set;
  17. }
  18. }
To Bind country list in Dropdown I created one method.
  1. private void AddElementsInList()
  2. {
  3. // 1 element
  4. DDL_Country obj = new DDL_Country();
  5. obj.Country_ID = 10;
  6. obj.Country_Name = "India";
  7. objCountryList.Add(obj);
  8. obj = new DDL_Country();
  9. obj.Country_ID = 11;
  10. obj.Country_Name = "Pakistan";
  11. objCountryList.Add(obj);
  12. obj = new DDL_Country();
  13. obj.Country_ID = 12;
  14. obj.Country_Name = "America";
  15. objCountryList.Add(obj);
  16. obj = new DDL_Country();
  17. obj.Country_ID = 13;
  18. obj.Country_Name = "U.K";
  19. objCountryList.Add(obj);
  20. obj = new DDL_Country();
  21. obj.Country_ID = 14;
  22. obj.Country_Name = "Arab";
  23. objCountryList.Add(obj);
  24. }
Please Find below the whle CS page code.

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Windows;
  4. using System.Windows.Controls;
  5. using System.Linq;
  7. namespace MultiSelectCombobox
  8. {
  9. /// <summary>
  10. /// Interaction logic for MainWindow.xaml
  11. /// </summary>
  12. public partial class MainWindow: Window
  13. {
  14. List < DDL_Country > objCountryList;
  16. public MainWindow()
  17. {
  18. InitializeComponent();
  19. objCountryList = new List < DDL_Country > ();
  20. AddElementsInList();
  21. BindCountryDropDown();
  22. }
  25. private void BindCountryDropDown()
  26. {
  27. ddlCountry.ItemsSource = objCountryList;
  28. }
  29. private void ddlCountry_SelectionChanged(object sender, SelectionChangedEventArgs e)
  30. {
  32. }
  34. private void ddlCountry_TextChanged(object sender, TextChangedEventArgs e)
  35. {
  36. ddlCountry.ItemsSource = objCountryList.Where(x => x.Country_Name.StartsWith(ddlCountry.Text.Trim()));
  37. }
  39. private void AllCheckbocx_CheckedAndUnchecked(object sender, RoutedEventArgs e)
  40. {
  41. BindListBOX();
  42. }
  44. private void BindListBOX()
  45. {
  46. testListbox.Items.Clear();
  47. foreach(var country in objCountryList)
  48. {
  49. if (country.Check_Status == true)
  50. {
  51. testListbox.Items.Add(country.Country_Name);
  52. }
  53. }
  54. }
  56. private void AddElementsInList()
  57. {
  58. // 1 element
  59. DDL_Country obj = new DDL_Country();
  60. obj.Country_ID = 10;
  61. obj.Country_Name = "India";
  62. objCountryList.Add(obj);
  63. obj = new DDL_Country();
  64. obj.Country_ID = 11;
  65. obj.Country_Name = "Pakistan";
  66. objCountryList.Add(obj);
  67. obj = new DDL_Country();
  68. obj.Country_ID = 12;
  69. obj.Country_Name = "America";
  70. objCountryList.Add(obj);
  71. obj = new DDL_Country();
  72. obj.Country_ID = 13;
  73. obj.Country_Name = "U.K";
  74. objCountryList.Add(obj);
  75. obj = new DDL_Country();
  76. obj.Country_ID = 14;
  77. obj.Country_Name = "Arab";
  78. objCountryList.Add(obj);
  79. }
  80. }
  82. public class DDL_Country
  83. {
  84. public int Country_ID
  85. {
  86. get;
  87. set;
  88. }
  89. public string Country_Name
  90. {
  91. get;
  92. set;
  93. }
  94. public Boolean Check_Status
  95. {
  96. get;
  97. set;
  98. }
  99. }
  100. }