Hustler101
Hustler101

Reputation: 33

MVC Dropdown List Not showing Values after select using Form-Control class

I have a viewmodel returning a selectlist which is being passed to a dropdownlistfor. if I dont add the @class="form-control" the control works as expected but once I apply the css class the values dont show once selected or when its in non active state. they are visible when you expand the dropdown and do seem to be held as the selected value but are not showing in the control?

here is my viewmodel and its implementation

public class DropdownViewModel
{
    public int DropdownSelectedID { get; set; }

    public IEnumerable<SelectListItem> Items
    {
        get; set;
    }
}


       var viewmodel = new DropdownViewModel();
        viewmodel.Items = new List<SelectListItem> {
                            new SelectListItem { Value = "1", Text = "First Department"},
                            new SelectListItem { Value = "2", Text = "Second Department"} };
        return View(viewmodel);

and here is my dropdownlist for and what it looks like?

@Html.DropDownListFor(m => m.DropdownSelectedID, Model.Items,"Please Select",new { @class="form-control"} )

this is what is looks like when selected

if I remove the class it looks like this

enter image description here

Please help - its driving me mad!

Upvotes: 1

Views: 401

Answers (1)

Hustler101
Hustler101

Reputation: 33

Arrrgh

I had overridden the style and missed the comma between the padding settings

like this padding: 20px 15px;

changed to this and problem solved padding: 20px, 15px;

Upvotes: 1

Related Questions