Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there a solution for using ASP.NET MVC 5 Html.EditorFor() and Bootstrap 3.0?

Question:

Is there a way to make the ASP.NET MVC 5 Html.EditorFor() form helpers work with the changed Bootstrap 3 form syntax.*?

Discussion (of what I have looked into already):

It appears there are a many SO questions regarding hacks to override the built in MVC helpers. In general, it doesn't look like there is a supported solution to modify the helper HTML. (please correct me if I'm wrong)

Therefore, is it possible to build a shim CSS file that adapts the Helper's 2.3.x HTML to the look of the Bootstrap 3 form CSS? It seems that most other aspects of MVC 5 are Bootstrap 3 compatible except for the auto form fields.

The benefit of a CSS shim, is that it could be removed when ASP.NET MVC is updated to support the newer Bootstrap syntax natively.

*I acknowledge that ASP.NET MVC 5 is still in beta and has been developed for Bootstrap 2.3.x since 3.0 was also in beta at the time.

like image 793
Dan Sorensen Avatar asked Aug 22 '13 16:08

Dan Sorensen


People also ask

Can we use bootstrap in MVC?

Since Bootstrap is all HTML, CSS and JavaScript, all open standards, you can use it with any framework including ASP.NET MVC.

What is the use of EditorFor in MVC?

The advantages of EditorFor is that your code is not tied to an <input type="text" . So if you decide to change something to the aspect of how your textboxes are rendered like wrapping them in a div you could simply write a custom editor template ( ~/Views/Shared/EditorTemplates/string.

How do you use same view for add and edit in MVC?

Use the same View Model aka CreateUpdateViewModel and discarding extra UpdateBindingModel properties in the view but still posting the corresponding model on POST. Having your binding models as properties and select one or the other in the specific view. (better use @Html.

Why we use HTML helpers in MVC?

We can use HTML Helpers to implement a method that returns a string. This tutorial discusses how you can define or create custom HTML Helpers that you can use within your MVC views. Using HTML Helpers, you can decrease the amount of repetitive typing of HTML tags within a standard HTML page.


2 Answers

There is now a MS solution for the MVC helpers.

It's currently Pre-release, but MVC5.1 has

MVC 5.1 is released and has

Bootstrap support in views

We now allow passing in html attributes in EditorFor as an anonymous object

Example code...

@Html.EditorFor(model => model, new { htmlAttributes = new { @class = "form-control" }, })

More info on this here.... http://www.asp.net/visual-studio/overview/2013/aspnet-and-web-tools-20132-preview-for-visual-studio-2013-release-notes#mvcbootstrap

.. and install instructions here... http://blogs.msdn.com/b/webdev/archive/2013/12/09/asp-net-and-web-tools-2013-2-preview-for-visual-studio-2013.aspx

like image 195
dave heywood Avatar answered Sep 28 '22 08:09

dave heywood


TwitterBootstrapMVC looks like a good abstraction over Bootstrap 3 - great with the Fluent API, BUT sending credit card details for a trial? Nope.

like image 43
gumaflux Avatar answered Sep 28 '22 09:09

gumaflux