Getting VS2010, and specifically a Razor view, to recognize custom "data-" attributes as valid - asp.net-mvc

I know that HTML5 supports custom data-* attributes, and I know that VS2010 SP1 is supposed to have HTML5 support included.
However, when I installed VS2010 SP1, I'm still getting validation errors on elements with data-* attributes.
For example, this:
<a id="Clicky" data-for="#Model.Id">Clicky</a>
Yields the following warning in VS2010:
Validation (XHTML 1.0 Transitional): Attribute 'data-for' is not a valid attribute of element 'a'.
While I understand that these are just warnings and can safely be ignored, I'm trying to keep my site as standards compliant as possible, and if my warnings list is spammed with these warnings, I won't be able to see the valid warnings through all the noise.
Am I doing something wrong, or must I live with seeing these warnings?
Thanks in advance.

There is a little dropdown that you need to change to use HTML5 or others (XHTML 5, XHTML 1.1, etc.)
Click View --> Toolbars --> HTML Source Editing.
There will be a dropdown. Then choose HTML5.

There is also a "Web Standards Update" extension available in the Visual Studio Extension Manager that updates some of the CSS/HTML5 intellisense features.
http://visualstudiogallery.msdn.microsoft.com/a15c3ce9-f58f-42b7-8668-53f6cdc2cd83?SRC=VSIDE

Related

Generate HTML 4 Semantics in MVC

While creating MVC 3 Razor, application we had selected Generate HTML5 Semantics. We realize that web app. has to be supported on IE8, as well.
How do I disable HTML 5 semantic generation, in existing MVC-3 project.
Thanks !
There's a setting in Visual Studio which allows you to change the DOCTYPE to HTML 4.01. Then you should of course replace all HTML5 tags in your markup:
Also if you include modernizr, IE8 can support semantic markup. Javascript will be used to achieve the same effects.

MVC4 Project with HTML5 Semantic markup HtmlHelper.EditorFor uses HTML5 input types

I have a ASP.NET MVC4 project with HTML5 semantic markup enabled. When using #Html.EditorFor(m => m.MyDateTimeField) the output is an input with type="datetime". I want to be able to stop EditorFor from generating HTML5 markup. How can I do this?
This is only a problem in Opera at the moment because other browsers (as far as I know) don't support type="datetime". I have a jQuery datepicker on the field so in Opera I get both the jQuery datepicker and the browser datepicker.
I can fix using any of:
a. Use js to change the input type
b. Use Html.TextBoxFor(m => m.MyDateTimeField)
c. Use a custom editor template
d. Use modernizr to detect if datetime is supported and if so, don't use jQuery datapicker
The solution I want is to disable HTML5 generation in HtmlHelper.EditorFor. I want HtmlHelper.EditorFor to function the same way it would if I hadn't ticked the "html5 semandtic markup" checkbox on project creation.
EDIT:
After a bit more searching, I've come across the DataTypeAttribute which I can apply on my model fields to force them to be rendered as input type="text" rather than the html5 match. This is a potential fix, but it is less than ideal. Surely there must be a switch somewhere to turn off html5 in EditorFor (and equivalent helpers)?
A bit more info:
I have two projects. The first one was created with "Html5 semantic markup" on, the other without. The first one uses html5 input types when using EditorFor, the second does not. I need to stop the first project EditorFor behaving the way is does without removing the EditorFor. There must be a setting somewhere?
The problem is in one of the project the package references are not updated properly and hence you are seeing the html5 semantic rendered.
This issue happens when you upgrade the ASP.NET MVC beta version to RC and there two ways you could solve the problem either updating all the packages through Nuget or manually add the reference to assemblies.
The issue and solution is clearly explained by Scott here.
That's really feature that got introduced and wasn't documented (nasty...). Basically ASP.NET MVC 4 now defines internal editor templates for Date and DateTime. In ASP.NET 3 there were no templates so I personally had an EditorTemplate (in Views\Shared\EditorTemplates) called DateTime.cshtml which was handling all DateTime types and dealing with DataTypes.Date vs DataTypes.DateTime. Now you need to override both templates. Nasty.
Edit: Basically if you just want to not touch any of your existing code define two templates Date.cshtml and DateTime.cshtml which both have #Html.TextBoxFor(model => model) in Views\Shared\EditorTemplates\

Asp.net MVC page is giving Mime type warnings for image files

While I do not see any functionally or jquery UI elements affected by this, but when I access my asp.net mvc web page the chrome developer console is logged with a bunch of error messages like so:
Resource interpreted as image but transferred with MIME type application/octet-stream.
All of the warnings are for jquery UI images (though I don't have any custom images on there so I don't know if it's jquery UI only). All the jquery images still load correctly.
Does anyone have any insight on why this is happening?
Are you running your site from Visual Studio's built-in web server? Apparently, you don't have much control over the MIME types in that environment (see this). I was seeing the same behavior and was starting to stress about it before finally realizing that I wasn't even looking at the IIS-hosted application.

jQueryUI css errors

When I load jQueryUI on a Windows XP machine using Firefox 3.6.3, I get a bunch of css errors:
Error in parsing value for 'filter' Lines 18, 76, 77.
Unknown property 'border-top-left-radius' Line 274.
Unknown property 'border-top-right-radius' Line 275.
unknown property 'zoom' Lines 300,306,336,345,385,408.
Q: Should I just ignore these errors?
The basic reason for these CSS errors is that every browser has its own set of CSS properties that jQuery UI makes use of. For example:
-moz-user-select is only available in Firefox and Mozilla-based browsers.
Equivalent to this property, WebKit-based browsers (like Google Chrome and Safari) have -webkit-user-select.
jQuery UI makes use of these special CSS properties available in different browsers and this gracefully degrades to nothing if the browser doesn't support that particular property. jQuery UI makes pretty sure that all its widgets appear consistent across browsers. And that is the reason why its safe to avoid such errors without any visual artifacts being generated by them.
Yes, you should ignore these.
There are attributes in there to support all browsers, not all necessarily valid CSS, but it works.
You can see a full list of current validation errors here (jQuery UI 1.8)
Yes. jQuery UI is using properties that are not consistent across browsers. Since there really isn't any "logic" in CSS, they have to list all possibilities for all browsers.
These errors are safe to ignore.

Why I get a "Active schema does not support the element"?

I'm working with Visual Studio 2003 and ultra grid.
In my html code I can see tag error like
active schema does not support the element...
However, I don't see any problem to execute my web application. I just wanted to know why I am getting Tag error. Is it because of third party tool ultrgrid?
The visual studio designer has its own HTML schema validator. You may see HTML validation errors in design mode eventhough the website works fine.
It could be that Infragistics assemblies are loading from the GAC and not the "bin" directory of the website.
Make sure that your references to the Infragistics assemblies are set to "Copy Local". Please refer to this article for more information.
The IDE validates your HTML to a schema - see here.
You could try to put valid HTML (if its not) or add a schema to use (details here).

Resources