Skip to main content
Home  › ... 2sxc Apps

Razor Blade Tutorials

Tutorial Home
Safe Html5 Attributes from code 
#2 Json Html5 Attributes from code 
RazorBlade - using the Html5 Tag API

RazorBlade Advanced JSON Attributes with @Tag.Attr v3

Here we'll go through some more advanced examples using @Tag.Attr(...)
Requirements
Resources

Creating Attributes Containing JSON
This div has an attribute created using an object, because we wanted json. If you look at the source, youll find data-my='{"Name":"razor","Description":"This isn\u0027t your normal text - it has \n line breaks and apostrophes"}'
Safe Html5 Attributes from code 
#2 Json Html5 Attributes from code 
RazorBlade - using the Html5 Tag API

Source Code of this file

Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code 

@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
<!-- unimportant stuff, hidden -->
RazorBlade Advanced JSON Attributes with... <!-- unimportant stuff, hidden -->

Creating Attributes Containing JSON
@{
  // this is the object we want in the data-attribute
  var myObj = new { 
    Name = "razor", 
    Description="This isn't your normal text - it has \n line breaks and apostrophes"
  };
}
<div class="alert alert-secondary" @Tag.Attr("data-my", myObj)>
  This div has an attribute created using... <!-- unimportant stuff, hidden -->
</div>


<!-- unimportant stuff, hidden -->