Editor and EditorFor do not write htmlAttibutes

[roryprimrose]

I seem to be in a no win situation here. Editor/EditorFor does not render html attributes (namely the class attribute) so the view appears to be incorrect in its usage for Editor. Unfortunately the alternative of TextBoxFor for example does support html attribute rendering but drops support for html5 input types.

Is there any way around this? I can either have the full bootstrap styling on input fields but no HTML5 or vice versa.

[erichexter]

I know there is a nuget package that add html5 inputs for all the editor templates.. under the hood mvc will look for razor views in the /views/shared/editortemplates/(type).cshtml. So, providing the templates there will get you around trying to send the html attributes through from the c# code in the view.

Take a look at this nuget package.. http://nuget.org/packages/MvcHtml5Templates

The source for that package is here. https://github.com/srkirkland/Html5MvcTemplates/tree/master/src/html5Templates.Web/Views/Shared/EditorTemplates

If we want we can take the same approach and create views that are optimized for bootstrap.

What would really help me is if you had a sample I could look at say on github. we could use that as use case we want to make work, and make sure we cover all the input types. I have been thinking about adding a sample project to the bootstrap.mvc4 repository, so i I do that you could help me fill in the various view model property types that your having an issue with.

Eric Hexter

blog | http://Hex.LosTechies.com info | http://www.linkedin.com/in/erichexter

On Sun, Dec 2, 2012 at 6:56 AM, roryprimrose notifications@github.comwrote:

I seem to be in a no win situation here. Editor/EditorFor does not render html attributes (namely the class attribute) so the view appears to be incorrect in its usage for Editor. Unfortunately the alternative of TextBoxFor for example does support html attribute rendering but drops support for html5 input types.

Is there any way around this? I can either have the full bootstrap styling on input fields but no HTML5 or vice versa.

— Reply to this email directly or view it on GitHubhttps://github.com/erichexter/twitter.bootstrap.mvc/issues/25.

[roryprimrose]

Thanks Eric, I figured that would be the best solution. I'll give that Nuget package a go today. If that is a viable alternative, it probably wouldn't be worthwhile duplicating that package in this one.

This is how I came across this:

I was using EditorFor as per your views but wanted a description field to be longer. I updated the style to xxlarge but found that the UI didn't change. Chrome dev tools then identified completely different classes being assigned to the control.

I then tried TextBoxFor and it worked fine. After that I then applied TextBoxFor for all the text fields but then found that numeric fields lost the html5 rendering (no up/down buttons and type was simply input).

I looked into the implementation for TextBoxFor and EditorFor and found the discrepancy that I original posted about.

[roryprimrose]

That Nuget package doesn't work. It basically adds in the editor templates that are built into MVC4. That package is what you would use for MVC3. Either way, they only get used when you call Editor or EditorFor which has the same restriction of not supporting html attributes.

I have found http://nuget.org/packages/MVCHtml5Toolkit which does the trick however. It provides a new set of extension methods that combine html5 input fields with the support of custom html attributes. This produces the exact outcome I am after.

An example of using this package is:

@Html.Html5TextBoxFor(model => model.Email, InputTypes.InputType.Email, new { @class = "input-xxlarge" })

There are however two things I don't like about the package:

1. It uses a System.Web.* namespace which I think should be reserved for assemblies that are bundled with the .Net framework. This assembly however is neither a Microsoft assembly or bundled with the CLR.
2. It uses a parameter to define the HTML5 input type. I understand that this is the path of least resistance, but using the Editor/EditorFor rules for determining this automatically would have been nicer (see http://omegaluz.wordpress.com/2011/12/01/an-exploration-of-html5-editor-templates-with-mvc/ for an example of the automatic rules).

That being said, I'll get off my purist horse and use the best tool for the job. :)

I have left this issue open because I believe that it is still a bug. The views provided do not use the attributes as you intend when you pass them to Html.Editor().

[erichexter]

great job following thru this. So, all this being said; this package is to make it easier to use bootstrap in mvc. It is perfectly fine to just write the html and forgo using the EditorFor all together. Doing that does not make an application any less pure.

Really what I think is probably the best path forward would be to open up a discussion with the MVC team; determine if they are will to accept a pull request to extend the editorFor apil and then put the change into the framework. They made it open source for a reason.

Eric Hexter

blog | http://Hex.LosTechies.com info | http://www.linkedin.com/in/erichexter

On Sun, Dec 2, 2012 at 9:15 PM, roryprimrose notifications@github.comwrote:

That Nuget package doesn't work. It basically adds in the editor templates that are built into MVC4. That package is what you would use for MVC3. Either way, they only get used when you call Editor or EditorFor which has the same restriction of not supporting html attributes.

I have found http://nuget.org/packages/MVCHtml5Toolkit which does the trick however. It provides a new set of extension methods that combine html5 input fields with the support of custom html attributes. This produces the exact outcome I am after.

An example of using this package is:

@Html.Html5TextBoxFor(model => model.Email, InputTypes.InputType.Email, new { @class = "input-xxlarge" })

There are however two things I don't like about the package:

1. It uses a System.Web.* namespace which I think should be reserved for assemblies that are bundled with the .Net framework. This assembly however is neither a Microsoft assembly or bundled with the CLR.
2. It uses a parameter to define the HTML5 input type. I understand that this is the path of least resistance, but using the Editor/EditorFor rules for determining this automatically would have been nicer (see http://omegaluz.wordpress.com/2011/12/01/an-exploration-of-html5-editor-templates-with-mvc/for an example of the automatic rules).

That being said, I'll get off my purist horse and use the best tool for the job. :)

I have left this issue open because I believe that it is still a bug. The views provided do not use the attributes as you intend when you pass them to Html.Editor().

— Reply to this email directly or view it on GitHubhttps://github.com/erichexter/twitter.bootstrap.mvc/issues/25#issuecomment-10940353.

[roryprimrose]

Yep, absolutely agree. An overload that accepts object htmlAttributes (and a dictionary overload) should be on Editor and EditorFor.

[kmiloaguilar]

@erichexter & @roryprimrose I just got into this when I updated the views to support the new bootstrap version. I found this: http://www.asp.net/mvc/overview/releases/mvc51-release-notes#Bootstrap

Once I installed the mvc version 5.1.2 it worked without any problem. But in the case someone else wants to use a older version of mvc will not work for creating dynamic forms.

[erichexter]

we can add a install.ps1 that validates the mvc version and shows a warning if it does not work.

Eric Hexter

blog | http://Hex.LosTechies.com info | http://www.linkedin.com/in/erichexter

On Thu, Nov 13, 2014 at 8:38 AM, Camilo Aguilar notifications@github.com wrote:

@erichexter https://github.com/erichexter & @roryprimrose https://github.com/roryprimrose I just got into this when I updated the views to support the new bootstrap version. I found this: http://www.asp.net/mvc/overview/releases/mvc51-release-notes#Bootstrap

Once I installed the mvc version 5.1.2 it worked without any problem. But in the case someone else wants to use a older version of mvc will not work for creating dynamic forms.

Reply to this email directly or view it on GitHub https://github.com/erichexter/twitter.bootstrap.mvc/issues/25#issuecomment-62898857 .

[kmiloaguilar]

Oh good idea. I was thinking the same but didn't know how to do it haha

I will do a research on how to do that.

[erichexter]

1could parse the packages.config

2. walk the dll references in the project using the DTE
3. use the nuget command get-package mvc | expand the version property and compare it. we could also put a dependency on the mvc package with that specific version