I’ve posted previously about how you can change the Dijit control type of the ComboBox to give it different functionality or behavior.
See Creating a Searchable & Filterable ComboBox in Infor CRM
In that post, I showed how to change the ComboBox’s data-dojo-type
attribute to change it from a normal ComboBox to a filterable & searchable ComboBox. In this post, we’ll be doing the same to change the ComboBox into a multi-select ListBox.
First of all, in this example, we’ll be populating a ComboBox with teams. The code to load the ComboBox will look like this:
// get all teams var teams = Sage.Platform.EntityFactory.GetRepository<Sage.Entity.Interfaces.ITeam>().FindAll(); // load into combobox foreach (var team in teams) { comboTeams.Items.Add(new System.Web.UI.WebControls.ListItem(team.SeccodeDesc, team.Id.ToString())); }
Up to this point, we have a normal ComboBox where the user can select a single team. It looks like this:
Just a normal, single select ComboBox. Now, let’s change that to allow multiple selections. First, we need to change the control’s data-dojo-type
to a different type of Dijit control called “dijit.form.MultiSelect“. We’ll also need to adjust the height of the control since we’ll be showing multiple items at once and we need more to be visible. Lastly, we’ll need to tell ASP.NET that our ComboBox does in fact allow multiple selections. In the form’s LoadAction (likely where we are already populating the teams into our ComboBox) we’ll add the following code:
comboTeams.Attributes["data-dojo-type"] = "dijit.form.MultiSelect"; comboTeams.Attributes["style"] = "height:200px;"; comboTeams.SelectionMode = System.Web.UI.WebControls.ListSelectionMode.Multiple;
Now what our form looks like is this:
That’s a nice change for just a small amount of code. The only thing left is how we retrieve the multi-selected items. We can do that by looping through the items like this:
foreach (System.Web.UI.WebControls.ListItem item in comboTeams.Items) { if (item.Selected) { var teamName = item.Text; var teamId = item.Value; // now do whatever you need with the team } }
That’s it, you now have a working multi-select list in Infor CRM without the need for resorting to a custom SmartPart.