mercredi 1 mars 2017

How to change dropdown list to multiselect dropdown list

I have dynamically populated dropdown list, which I have tried to change to support multiselection. I have tried change the Html.DropDownList to ListBox, SelectList to MultiSelectList and html attribute: new { multiple = "multiple" }. But just cant get this to work. Can you help me?

Dynamically populate the dropdownlist:

$.post('<%= Url.Action("Groups", "Units") %>', { unitId: $('#UnitId').val() }, function (data) {
    $('#Groups').html('<option value="null">Select group</option>');
    $.each(data.list, function (index, element) {
        $('#Groups').append('<option value="' + element.Id + '">' + element.Name + '</option>');
        $('#li-group > .fade').hide();

Show the dropdown list:

<!-- Group dropdown list -->
<li id="li-group">
    <div class="fade"></div>
    <%= @Html.DropDownList("Groups", new SelectList (new List<Object> { new { value = "null", text = "Select group" } }, "value", "text" )) %>

Send the selection to controller:

$('#page-content > .wrapper').load(url, { Group: $('#Groups').val() });

public ActionResult GroupSelection(string Group)

Tried to change this to:

$('#page-content > .wrapper').load(url, { Group: $('#Groups option:selected').val() });

public ActionResult GroupSelection(List<string> Group)


public ActionResult GroupSelection(string[] Group)

Aucun commentaire:

Enregistrer un commentaire