Friday 5 September 2014

Razor, data attributes, all that jazz.

Take this pretty normal HTML
<input checked="checked" data-extension="pdf" data-type="file" name="ft" type="radio" value="pdf" />PDF

You get some pretty standard results remdered

Take this razorized variable HTML:
@{var s = @"input type=""radio"" name=""ft"" ";}
<@s data-extension="pdf" data-type="file" checked="checked" value="pdf" />PDF

You get some pretty interesting HTML
<input checked="checked" data-extension="pdf" data-type="file" name=""ft"" type=""radio"" value="pdf" />

Which is Really interesting when rendered (Chrome and  IE10, most likely all of the usual suspects)

-----
And if you find that amusing, how about this: Saving things in the Blogger "Compose" view isn't really great at encoding the HTML used, so this:

Becomes this:
Derrrp! Are the data attributes to blame?