Adding a css class to select using @Html.DropDownList()

asp.net MvcRazor

asp.net Mvc Problem Overview


I'm building my first MVC application after years of doing webforms, and for some reason I am not able to make this work:

@Html.DropDownList("PriorityID", String.Empty, new {@class="textbox"} )

Error message:

System.Web.Mvc.HtmlHelper<SPDR.Models.Bug>' does not contain a definition for DropDownList and the best extension method overload System.Web.Mvc.Html.SelectExtensions.DropDownList(System.Web.Mvc.HtmlHelper, string, System.Collections.Generic.IEnumerable<System.Web.Mvc.SelectListItem>, object) has some invalid arguments

Any help greatly appreciated!

asp.net Mvc Solutions


Solution 1 - asp.net Mvc

Looking at the controller, and learing a bit more about how MVC actually works, I was able to make sense of this.

My view was one of the auto-generated ones, and contained this line of code:

@Html.DropDownList("PriorityID", string.Empty)

To add html attributes, I needed to do something like this:

@Html.DropDownList("PriorityID", (IEnumerable<SelectListItem>)ViewBag.PriorityID, new { @class="dropdown" })

Thanks again to @Laurent for your help, I realise the question wasn't as clear as it could have been...

UPDATE:

A better way of doing this would be to use DropDownListFor where possible, that way you don't rely on a magic string for the name attribute

@Html.DropDownListFor(x => x.PriorityID, (IEnumerable<SelectListItem>)ViewBag.PriorityID, new { @class = "dropdown" })

Solution 2 - asp.net Mvc

As the signature from the error message implies, the second argument must be an IEnumerable, more specifically, an IEnumerable of SelectListItem. It is the list of choices. You can use the SelectList type, which is a IEnumerable of SelectListItem. For a list with no choices:

@Html.DropDownList("PriorityID", new List<SelectListItem>(), new {@class="textbox"} )

For a list with a few choices:

@Html.DropDownList(
    "PriorityID", 
    new List<SelectListItem> 
    { 
        new SelectListItem { Text = "High", Value = 1 }, 
        new SelectListItem { Text = "Low",  Value = 0 },
    }, 
    new {@class="textbox"})

Maybe this tutorial can be of help: How to create a DropDownList with ASP.NET MVC

Solution 3 - asp.net Mvc

If you are add more than argument ya dropdownlist in Asp.Net MVC. When you Edit record or pass value in view bag.

Use this it will be work:-

@Html.DropDownList("CurrencyID",null,String.Empty, new { @class = "form-control-mandatory" })

Solution 4 - asp.net Mvc

There are some options in constructors look, if you don't have dropdownList and you wanna insert CSS class you can use like

@Html.DropDownList("Country", null, "Choose-Category", new {@class="form-control"})

in this case Country is the name of your dropdown, null is for you aren't passing any generic list from your controller "Choose-Category" is selected item and last one in CSS class if you don't wanna select any default option so simple replace "Choose-Category" with ""

Solution 5 - asp.net Mvc

You Can do it using jQuery

  $("select").addClass("form-control")

here, Select is- html tag, Form-control is- class name

 @Html.DropDownList("SupplierId", "Select Supplier")

and here, SupplierId is ViewBagList, Select Supplier is - Display Name

Solution 6 - asp.net Mvc

Simply Try this

@Html.DropDownList("PriorityID", (IEnumerable<SelectListItem>)ViewBag.PriorityID,  new { @class="dropdown" })

But if you want a default value or no option value then you must have to try this one, because String.Empty will select that no value for you which will work as a -select- as default option

@Html.DropDownList("PriorityID", (IEnumerable<SelectListItem>)ViewBag.PriorityID, String.Empty, new { @class="dropdown" })

Solution 7 - asp.net Mvc

Try below code:

@Html.DropDownList("ProductTypeID",null,"",new { @class = "form-control"})

Solution 8 - asp.net Mvc

Try this:

@Html.DropDownList(
    "country", 
    new[] {
        new SelectListItem() { Value = "IN", Text = "India" },
        new SelectListItem() { Value = "US", Text = "United States" }
    }, 
    "Country",
    new { @class = "form-control",@selected = Model.Country}
)

Solution 9 - asp.net Mvc

You can simply do this:

@Html.DropDownList("PriorityID", null, new { @class="form-control"})

Solution 10 - asp.net Mvc

Try This

 @Html.DropDownList("Id", null, new { @class = "ct-js-select ct-select-lg" })

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionLee BaileyView Question on Stackoverflow
Solution 1 - asp.net MvcLee BaileyView Answer on Stackoverflow
Solution 2 - asp.net MvcLaurentView Answer on Stackoverflow
Solution 3 - asp.net MvcmohitaView Answer on Stackoverflow
Solution 4 - asp.net Mvcmk MughalView Answer on Stackoverflow
Solution 5 - asp.net MvcPraveen M PView Answer on Stackoverflow
Solution 6 - asp.net MvcgdmanandamohonView Answer on Stackoverflow
Solution 7 - asp.net MvcAlfred JoseView Answer on Stackoverflow
Solution 8 - asp.net MvcAbhishek MauryaView Answer on Stackoverflow
Solution 9 - asp.net MvcladymbmView Answer on Stackoverflow
Solution 10 - asp.net MvcKrishna PrajapatiView Answer on Stackoverflow