How do I get the value of my second dropdownlist in MVC4?

Question

I've got these two cascading dropdown lists, they populate just fine. But when I hit submit I always gett NULL as the value of the second. My guess is that I have to do something with the javascript, but my skills in that department are seriously lacking. Please help!

Code removed, whole view added instead

I dont even have an HtmlHelper for the second dropdown, it just looks like this in the view:

Code removed, whole view added instead

Works just fine, I mean, it populates fine depending on what's chosen in the first dropdown. Maybe this is the part that needs alteration? The thing is I'm clueless.

EDIT:

This is the code that reads the information from the form and submits it to the database.

[HttpPost]
        public ActionResult Returer(ReturerDB retur)
        {
            if (ModelState.IsValid)
            {
                db2.ReturerDB.AddObject(retur);
                db2.SaveChanges();

                return RedirectToAction("Returer");
            }

            return View("Returer");
        }

EDIT2

The whole view code:

@model Fakturabolag.Models.ReturerDB

@{
    ViewBag.Title = "Returer";
}

<script type="text/javascript" src="../../Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $("#bolag").prop("disabled", true);
        $("#Kund").change(function () {
            if ($("#Kund").val() != "- Välj bolag -") {
                var options = {};
                options.url = "/companies/getbolag";
                options.type = "POST";
                options.data = JSON.stringify({ country: $("#Kund").val() });
                options.dataType = "json";
                options.contentType = "application/json";
                options.success = function (bolag) {
                    $("#bolag").empty();
                    for (var i = 0; i < bolag.length; i++) {
                        $("#bolag").append("<option>" + bolag[i] + "</option>");
                    }
                    $("#bolag").prop("disabled", false);
                };
                options.error = function () { alert("Fel vid bolagshämtning!"); };
                $.ajax(options);
            }
            else {
                $("#bolag").empty();
                $("#bolag").prop("disabled", true);
            }
        });
    });

</script>



    <h2>Returer</h2>

    @using (Html.BeginForm())
    {

    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Returer</legend>
        <br /><br />


        <div class="editor-label">
            <b>Kund</b>
        </div>

        <div class="editor-field">
            @Html.DropDownListFor(model => model.Kund, ViewData["kundLista"] as SelectList)
            @Html.ValidationMessageFor(model => model.Kund)
        </div>

        <div class="editor-label">
            <b>Bolag</b>
        </div>

        <select id="bolag"></select>

        <div class="editor-label">
            <b>Pris</b>
        </div>
        <div class="editor-field">
            @Html.TextBox("pris", null, new { style = "width: 150px" })
            @Html.ValidationMessageFor(model => model.Pris)
        </div>

        <div class="editor-label">
            <b>Datum</b>
        </div>
        <div class="editor-field">
            @Html.TextBox("datum", ViewData["datum"] as String, new { style = "width: 150px" })
            @Html.ValidationMessageFor(model => model.Datum)
        </div>

        <p>
            <input type="submit" value="Lägg till" />
        </p>
    </fieldset>
    }

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Answer 1

Currently you are not retrieving the additional value "bolag" in your action. I guess your model does not have property named "bolag". You can either add that or you can add additional parameter to you action like so:

    [HttpPost]
    public ActionResult Returer(ReturerDB retur, string bolag)
    {
        if (ModelState.IsValid)
        {
            db2.ReturerDB.AddObject(retur);
            db2.SaveChanges();

            return RedirectToAction("Returer");
        }

        return View("Returer");
    }

After that, the selected value from the dropdown should automatically be in the bolag-parameter.

Edit.

You also need to add name-attribute to your select:

  <select id="bolag" name="bolag"/>