Click here to Skip to main content
14,735,093 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi All,
IN MVC i have a multiselect dropdown list on change i am populating another dropdown. But not able to get multiselect values on the controller below is my code.

@Html.DropDownList("Country", ViewData["country"] as List<SelectListItem>, new {@multiple="multiple", style = "width:250px", @class = "dropdown1" })

Ajax call
<script type="text/javascript">
    $(document).ready(function () {
        $("#Country").change(function () {
            var abc = $("#Country").val();

                type: 'POST',
                url: '@Url.Action("GetStates")', // we are calling json method
                dataType: 'json',
                //data: { id: $("#Country").val() },
                data: { "CountryId": abc },
                cache: false,
                success: function (states) {
                    // states contains the JSON formatted list
                    // of states passed from the controller
                    $.each(states, function (i, state) {

                        $("#State").append('<option value="' + state.Value + '">' + state.Text + '</option>');
                    }); // here we are adding option for States
                error: function (ex) {
                    alert('Failed to retrieve states.' + ex);
            return false;

public JsonResult GetStates(string CountryId)
          return null;

But i am getting CountryId as NULL for multi select dropdown case only for normal dropdown i am getting the value,

Please help

What I have tried:

i have tried the above code for the same but always get a null value for multiselect dropdown case
Updated 23-May-16 2:50am
Karthik_Mahalingam 23-May-16 7:21am
are you getting values in abc variable?
Raj tilak Bose 23-May-16 7:31am
in jquery abc in am getting the value

1 solution

Change the Action method parameter from string to string[]
since the $('#country').val() will return a javascript array.
public ActionResult GetStates(string[] CountryId)

and add traditional property in the ajax method
traditional: true,

traditional property is used to serialise the array object to pass to the controller, it can be done using jQuery.param() [^] also. either ways it will work..
Raj tilak Bose 23-May-16 7:56am
Thanks Its working now with "traditional: true," :)
Karthik_Mahalingam 23-May-16 7:57am
welcome :)
updated my solution.
please explore tradional and param
Raje_ 23-May-16 8:27am
Karthik_Mahalingam 23-May-16 8:31am
Thanks Raje_

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

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900