c# MVC Dropdownlist post selected value

Question

Let me start by saying this: I have looked at multiple answers, and I can't just seem to wrap my head around it - it may be that I'm just brainfarted. But here goes my question:

My question is specifically regarding the dropdownlist: With the hardcoded values: today, month, year.

Whenever I select something in the dropdownlist, I want to post/submit the value, for example "today" to the controller. How do I do this?

Thanks for your time.

@using (Html.BeginForm("DisplayDetails", "Client"))
{
    @*Start of searchBox*@
    <div id="searchBox">
        Enter client e-mail: <input id="txtUser" type="text" name="clientID" /> <input id="btnFind" type="submit" />
    </div>
    @*<--- End of searchBox --->*@

    if (Model != null)
    {
        @*Start of infobox and wrapper*@
        <div id="infoBoxWrapper">
            <div class="infoBox">
                <fieldset>
                    <legend style="padding: 0.2em 0.5em; border: 1px solid black; font-size: large;"> Client info </legend>

                    <table>
                        <tr>
                            <td> <b> First name: </b></td>
                            <td>
                                @Html.DisplayFor(m => m.FName)
                            </td>

                        </tr>
                        <tr>
                            <td> <b> Last name: </b></td>
                            <td> @Html.DisplayFor(m => m.LName) </td>
                        </tr>
                        <tr>
                            <td> <b> Phone: </b></td>
                            <td> @Html.DisplayFor(m => m.Phone)</td>
                        </tr>
                        <tr>
                            <td> <b> E-mail: </b></td>
                            <td> @Html.DisplayFor(m => m.UserID) </td>
                        </tr>
                    </table>

                </fieldset>
            </div>
            @*<--- End of infobox --->*@

            @*Start of recordsBox*@
            <div id="recordsBox">
                <fieldset>
                    <legend style="padding: 0.2em 0.5em; border: 1px solid black; font-size: large;"> Records </legend>
                    <table>
                        <tr>
                            <td> <b>Time</b></td>
                            <td> <b>Systolic</b> </td>
                            <td> <b>Diastolic</b> </td>
                            <td> <b>Pulse</b> </td>
                        </tr>
                        @for (int i = 0; i < Model.Records.Count; i++)
                        {
                            string style = null;
                            if (Model.Records[i].Score == 1) { style = "background-color:green"; }
                            else if (Model.Records[i].Score == 2) { style = "background-color:blue"; }
                            else if (Model.Records[i].Score == 3) { style = "background-color:yellow"; }
                            else if (Model.Records[i].Score == 4) { style = "background-color:orange"; }
                            else if (Model.Records[i].Score == 5) { style = "background-color:red"; }

                            <tr style="@style">
                                <td>
                                    @Model.Records[i].Time
                                </td>
                                <td>
                                    @Html.DisplayFor(m => m.Records[i].Systolic)
                                </td>
                                <td>
                                    @Html.DisplayFor(m => m.Records[i].Diastolic)
                                </td>
                                <td>
                                    @Html.DisplayFor(m => m.Records[i].Pulse)
                                </td>
                            </tr>
                        }
                    </table>
                </fieldset>
            </div>
        </div>
        @*<--- End of infobox wrapper --->*@

        @*Start of chartbox*@
        <div id="chartWrapper">
            <div id="comboBox">
                <select id="dpChoice">
                    <option value="today">Today</option>
                    <option value="month">This month</option>
                    <option value="year">This year</option>
                </select>
            </div>
            <div id="chartbox">
                @Model.Chart
            </div>
        </div>
        @*<--- End of chartbox --->*@
    }
    else
    {
        <label> Search for a client...</label>
    }
}

This SO question might help It shows how to make a POST to a controller when an item in a dropdown list is selected. Did you read this one during your research? — Jason Evans
– Jason Evans, Commented Aug 13, 2015 at 9:48

user3559349 · Accepted Answer · 2015-08-13 12:18:40Z

2

Your select does not have a name attribute so it is not sent in the form data. Change it to (say)

<select name="choice">
  ...
</select>

and depending if the first option is selected it will post back choice: today which you can access by adding the parameter string choice to your POST method. However I would strongly recommend you use a view model including

public class MyViewModel
{
  public int ClientEmail{ get; set; }
  public string Choice { get; set; }
  public IEnumerable<SelectListItem> ChoiceList { get; set; }
  ....
}

and populate the collection in the controller

model.ChoiceList = new List<SelectListItem>()
{
  new SelectListItem(){ Value = "today", Text = "Today" },
  new SelectListItem(){ Value = "month", Text = "This month" },
}

and then in the view

@Html.TextBoxFor(m => m.ClientEmail)
....
@Html.DropDownListFor(m => m.Choice, Model.ChoiceList)

and then post back the view model to the controller

answered Aug 13, 2015 at 12:18

user3559349

Sign up to request clarification or add additional context in comments.

10 Comments

Hans Frifelt Over a year ago

This helped me understand it a bit, though it is mostly posting that causes me the issues. I've worked with viewdata/viewbag/tempdata but it doesn't seem like what I'm looking for. The model includes a client with multiple records. The records are based on the dropdownlist (day, month and year). I want to update the records depending on the option chosen, but not client

user3559349 Over a year ago

Then what is the textbox for if your not changing it? Are you wanting to filter your table of records based on the selected option? If so, your controller method should be public ActionResult DisplayDetails(string choice) { ...} as I noted in the answer. Then change the form to BeginForm("DisplayDetails", "Client", FormMethod.Get). When you submit, the value of choice will be the value of the selected option so you can filter the data and return the view. But you will vastly improve performance if you use ajax to just update the current page rather that regenerating the whole view again.

Hans Frifelt Over a year ago

I use the textbox to find a specific client, it's merely a search field. The controller currently looks as you say, except it also takes a client ID. I do want to use Ajax, but I have no experience using, which is probably also cause of my confusion. Thanks for the help.

user3559349 Over a year ago

Strongly suggest you start learning javascript/jquery/ajax (its absolutely fundamental to writing web apps these days) and the code to do this is only 4 lines of code in a script :)

Hans Frifelt Over a year ago

No doubt. I've mostly been used to working in asp.net, so getting the concepts of MVC has been a bit tricky, and without the knowledge how to use Ajax/jquery it's a bit tricky, especially when you just jump into a project :p

|

Collectives™ on Stack Overflow

c# MVC Dropdownlist post selected value

1 Answer 1

10 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

10 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related