MVC 5 scaffolding not emitting bootstrap classes for basic EF derived data

Question

First off, I'm a newcomer to MVC and ASP.NET so apologies if I'm missing something simple.

I'm working on a code first MVC 5 application, for the sake of brevity lets say I have two Models defined like this:

public class Platform
{
    [Key]
    public int Id { get; set; }

    [Required(ErrorMessage = "You must select a manufacturer")]
    [DisplayName("Manufacturer")]
    public int ManufacturerId { get; set; }
    public virtual Manufacturer Manufacturer { get; set; }

    [Required(ErrorMessage="You must enter a name for the platform")]
    [StringLength(50, ErrorMessage="Reduce length to 50 characters or less")]
    public string Name { get; set; }
}

and

public class Manufacturer
{
    [Key]
    public int Id { get; set; }

    [Required(ErrorMessage="You must enter a name for the manufacturer")]
    [StringLength(50, ErrorMessage="Reduce length to 50 characters or less")]
    public string Name { get; set; }

    public virtual ICollection<Platform> Platforms { get; set; }
}

When creating 'MVC 5 Controller with views, using Entity Framework' scaffolding for these models all the CRUD actions are working correctly. The form elements on the other hand are unformatted, missing the form-control class that Bootstrap wants.

I can work around this per type by adding an EditorTemplate with something like @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { @class = "form-control" }) in it, but surely the scaffolding for a Bootstrap MVC 5 project should be emitting valid code already? Looking at various MVC 5 tutorials they seem to be working correctly with proper styling, so I'm left somewhat confused as to what I'm doing wrong.

For reference, the output in the Create.cshtml file for each model (clipped to the important form elements for brevity) is:

<div class="form-group">
    @Html.LabelFor(model => model.ManufacturerId, "ManufacturerId", new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownList("ManufacturerId", String.Empty)
        @Html.ValidationMessageFor(model => model.ManufacturerId)
    </div>
</div>

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

and

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

Why is the ManufacturerId being specified as the label text for the drop down when a DisplayName is set in the model?

Why is the drop down using DropDownList() instead of the strongly typed DropDownListFor()?

Thank you in advance.

Answer 1

It looks like MVC 5.1 will have a workaround for the form-control problem with Bootstrap 3, as stated here. It will be possible to pass styles for EditorFor.