How do I get the Selected Value of a DropDownList in ASP.NET Core MVC App

Question

I have the following dropdownlist in my view:

@{
    var listado = new List<SelectListItem>()
    {
       new SelectListItem()
       {
           Text ="YES",
           Value ="1"
       },
       new SelectListItem()
       {
           Text = "NO",
           Value = "2"
       }
   };
}

<div class="form-group">
    <label class="control-label">Is it True ?</label>
    @Html.DropDownList("miDropDownList",listado)
</div>

I want to get the selected value 'YES' or 'NO' to do something in the controller like so:

IActionResult ControllerAction(){
  var theValue = dropdownList.SelectedValue //this is pseudocode syntax but you understand I want to get 
                                            //the value

 // with the value I will do something like this: 
  User userinstance = new User {
     Id = 1,
     Name = "john",
     isJohnTall = theValue.Value 
  }
}

I want something simple in other answers I've seen DropDownLists that are bound to models, but I just want to get strings selected in the dropdown and be able to do something with them in the controller.

The database is bad designed so the field I want to populated is string and not boolean as it should be, because it's a yes or not property so that confuses me and I think it would be way easier just to take the yes or not and then when I create the user instance to be added to the table I pass ots value.. I'm a little confused about how to link the Dropdown to a property in the model also, to be honest.. — armando t, Dec 15 '20 at 19:32
Sounds like you need a view model separate from your ef entity models. you could do that conversion there. or you could map your ef model property using HasConversion() to map the string to a bool — Fran, Dec 15 '20 at 19:36
that would be like having a mock model? and then passing the mock model property to the new instance of the real model ? — armando t, Dec 15 '20 at 19:43
Anyway is there no way for me to catch what the user has selected and use it in my controller as I want? I mean I'm making a form to post a register in the database and just that property is a select tag is something simple I think.. I don't want to map or get complicated — armando t, Dec 15 '20 at 19:45

score 1 · Answer 1 · answered Dec 15 '20 at 20:51

1

You can use JQuery with ajax.

Something like this:

<div class="form-group">
    <label class="control-label">Is it True ?</label>
    @Html.DropDownList("miDropDownList", listado, new { @onchange = "GetYesOrNo()"})
</div>

<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script>

    function GetYesOrNo() {
        var selectElement = document.querySelector('#miDropDownList');
        var option = selectElement.value;

        $.ajax({
            url: '/Home/GetYesOrNo',
            type: 'GET',
            dataType: 'json',
            contentType: 'application/json; charset=utf-8',
            mimeType: 'text/html',
            data: { getOption : option },
            success: function (returnValue) {
                alert(returnValue);
            }
        });
    };
</script>

And in Home Controller, add this JsonResult:

    public JsonResult GetYesOrNo(int getOption)
    {
        if (getOption == 1) return Json("Option: YES");
        return Json("Option: NO");
    }

answered Dec 15 '20 at 20:51

Anderson Siquelli Teofilo

11
1

Ok so in my UserController I call the GetYesOrNo() method to get the JSON result "Option: Yes" or "Option: No" but what do I send as a parameter? – armando t Dec 15 '20 at 21:18
how is it possible that there is no way of simply make a reference to the DropdownList in my controller without having to bind the data to a model that's all I need – armando t Dec 15 '20 at 21:57
@armandot there is no easy way to for this. You need to bind data to the model at controller level. Either submit value using ajax as shown here, or just submit the form using submit button. Either way you will have to bind it to the variable or model property. Controllers are detached from view/razor pages, so server doesn't know what is on the page. [Read this article for more info](https://www.tektutorialshub.com/asp-net-core/asp-net-core-model-binding/) – Pirate Dec 15 '20 at 22:10

Yinqiu · Accepted Answer · 2020-12-16T02:15:15.760

You can use a form to submit your data. The form will submit Value, so you can modify your value as Text.

You can change your code like below.

View:

    @{
    var listado = new List<SelectListItem>()
{
                   new SelectListItem()
                   {
                       Text ="YES",
                       Value ="YES"
                   },
                   new SelectListItem()
                   {
                       Text = "NO",
                       Value = "NO"
                   }
               };
}
@using (Html.BeginForm("GetYesOrNo", "User"))
{
    <div class="form-group">
        <label class="control-label">Is it True ?</label>
        @Html.DropDownList("miDropDownList", listado)
    </div>
    <button type="submit">Find</button>
}

Action:

public IActionResult GetYesOrNo(string miDropDownList)
    {
        //.....
        return View();
    }

Test result:

And how to bind to the model with dropdownlist,you can see my this reply,it may helpful.

Thank you that solve my problem it was so easy... and that was exactly what I was doing from the beginning but in the Action, I was passing a List instead of passing a string... I don't get it how the compiler knows I want the VALUE property of my items just by creating a parameter of type string with the same name of the ddl?... well thank you again it worked! — armando t, Dec 16 '20 at 16:02

How do I get the Selected Value of a DropDownList in ASP.NET Core MVC App

2 Answers2

Linked