How to get value after Submit - ASP.NET CORE MVC

Question

I'm having trouble retrieving the value for DropDownList. This is my Create.cshtml:

@model BikeService.Models.Bike

@{
    ViewData["Title"] = "Add new Bike";
}

<form method="post" asp-action="Create">
                <div class="form-group row">
                    <div class="col-4">
                        <label asp-for="Customer" class=""></label>
                    </div>
                    <div class="col-8 dropdown">
                        @{
                            var options = new SelectList(@ViewBag.ListOfCustomers, "Id", "Name");

                            @Html.DropDownList("customers", options);
                        }
                    </div>
                </div>
    </div>
</form>

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

The data for the DropDownList comes in fine.

<div class="col-8 dropdown">
  <select id="customers" name="customers">
    <option value="3384186f-a3c4-4afe-a5be-12544a91acb7">Alex</option>
    <option value="93b68f45-9c24-45e1-afc0-4549610b7c0d">John</option>
    <option value="456502ca-f08f-49e6-ad90-d32be262ed58">Petter<option>
  </select>
</div>

This is the controller

[HttpPost]
        public async Task<IActionResult> Create(Bike bike)
        {
            await _bikeServices.AddBike(bike);
            return View();
        }

Although in option in dropdownlist is assigned correctly, to controller at CustomerID value field is empty, selected value is not sent.

Answer 1

The mvc framework maps the name of the input element to the property of the model when the form is posted.

So the dropdownlist name should be CustomerID not customers . Try:

@Html.DropDownList("CustomerID", options)

Now the select element will be rendered like:

<select id="CustomerID" name="CustomerID">
<option value="3384186f-a3c4-4afe-a5be-12544a91acb7">Alex</option>
<option value="93b68f45-9c24-45e1-afc0-4549610b7c0d">John</option>
<option value="456502ca-f08f-49e6-ad90-d32be262ed58">Petter<option>
</select>

and the selected value will be posted back in the Bike model in the CustomerID property.

Answer 2

I have seen this where you accidentally send NULL instead of the GUID value. It might be worth putting this in your Configure in Startup.cs (assuming common setup), so that you can examine the JSON POST. Alternatively, POST it to PostMan from your front end.

app.Use(async(context, next) =>
{
    using (var reader = new System.IO.StreamReader(context.Request.Body))
    {
        var body = reader.ReadToEnd();

        // Output to console or logger, or just add a break-point here
        Console.WriteLine(body);
    }
}

If that doesn't help, share your "Bike" class DTO so we can replicate.