Buda Cristian
Buda Cristian

Reputation: 277

ASP.NET Razor page dropdown list

 <div class="form-group">
            @Html.LabelFor(model => model.CountyId, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CountyId, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CountyId, "", new { @class = "text-danger" })
            </div>
        </div>

So I have the following code on my website. What I want to do is instead of having a text field where you type the countyID I would like to have the county name dropdown list where the user selects it by name and it would still register as a number. (For example instead of writing "1" he would just click and choose County1 from a list I make)

Edit: Alright now I have this code

@Html.DropDownList("Counties", new List<SelectListItem>
                   {
                       new SelectListItem {Text = "Alba", Value = "1", Selected = true },
                       new SelectListItem {Text = "Arad", Value = "2" },
                       new SelectListItem {Text = "Arges", Value = "3" },
                       new SelectListItem {Text = "Bacau", Value = "4" },
                   }, "Select County")
                @Html.EditorFor(model => model.CountyId, new { htmlAttributes = new { @class = "form-control" } })

How do I write it to replace the @Html.EditorFor(model => model.CountyId with the DropDownList selection?

Edit2: how do I use @Html.DropDownListFor ?

Upvotes: 6

Views: 24781

Answers (4)

mostafa taheri
mostafa taheri

Reputation: 1

There are so many ways to do this, you can use this :

<div class="form-group col-4">
                                <label for="issueinput6">category</label>
                                <select id="issueinput6" class="form-control" data-toggle="tooltip" data-trigger="hover" data-placement="top"
                                        data-title="Status">
                                    @foreach (var item in ViewData["Categoryes"] as IList<AirPortModel.Models.Category>)
                                    {

                                        <option value="@item.Id">@item.CategoryName</option>
                                    }

                                </select>
                            </div>

This way, you have all the information you want as a drop down. These codes are from my project but you can change the names to use it for your own. Also, you can use this pic of code to solve your problem.

<select data-val="true" data-val-required="The Category field is required." id="category" name="1">
<option value="">Pick one</option>
<option selected="selected" value="0">blabla</option>
<option value="1">blabla</option>
<option value="2">blabla</option>
<option value="3">blabla</option>
<option value="4">blabla</option>
<option value="5">blabla</option>
<option value="6">blabla</option>

Upvotes: 0

Shyju
Shyju

Reputation: 218752

You can use the Html.DropDownListFor helper method

Add a new property to your view model to store the dropdown options. This property should be of type List

public class CreateUser
{
  public int CountryId {set;get;}
  public List<SelectListItem> Countries {set;get;}
}

Now in your GET action, populate the Countries collection property value on this view model object.

public ActionResult Create()
{
  var vm = new CreateUser();
  vm.Countries = new List<SelectListItem> {
          new SelectListItem { Value="1", Text="USA" },
          new SelectListItem { Value="2", Text="Canada" },
          new SelectListItem { Value="3", Text="Mexico" }
        };
 return View(Vm);
}

And in your view

@model CreateUser
@using(Html.BeginForm())
{
  <label>Select country</label>
  @Html.DropDownListFor(s=>s.CountryId,Model.Countries,"Select one")
  <input type="submit" />      
}

Upvotes: 2

Felix Cen
Felix Cen

Reputation: 763

Buda, please try below

 <div class="form-group">
            @Html.LabelFor(model => model.CountyId, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
               @Html.DropDownListFor(model => model.CountyId, new List<SelectListItem>
                       {
                           new SelectListItem {Text = "Alba", Value = "1", Selected = true },
                           new SelectListItem {Text = "Arad", Value = "2" },
                           new SelectListItem {Text = "Arges", Value = "3" },
                           new SelectListItem {Text = "Bacau", Value = "4" },
                       }, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.CountyId, "", new { @class = "text-danger" })
            </div>
        </div>

Upvotes: 3

Felix Cen
Felix Cen

Reputation: 763

Buda,

Probably you need to use the DropDownListFor html helper.

Please check the following answer to see if it clarifies your question

ASP.NET MVC + Populate dropdownlist

Upvotes: 1

Related Questions