How to write a new Doxml fragment

Process of adding a new Doxml fragment goes like this:

  1. Define XML schema for the fragment in Fragments.xsd.
  2. Run xsd.bat batch file.
  3. Build project.
  4. Implement Razor (cshtml) partial view in Views/Shared/Fragment/ with the the same name as the type defined in the XML schema.
  5. Document and test your fragment by using it in Fragments article.
  6. Refresh browser

Example: Creating <script> fragment

In this example we'll show how to create a fragment for inserting small JavaScript scripts to Doxml pages. By following the above procedure first step is to define XML schema.

<xs:complexType name="Script" mixed="true">
  <xs:complexContent>
    <xs:extension base="Fragment">
      <xs:attribute name="src" type="xs:string" use="optional" />
    </xs:extension>
  </xs:complexContent>
</xs:complexType>

<xs:element name="script" type="Script" substitutionGroup="fragment"/>

To Remember

All fragments should inherit Fragment base.

It's important to register your type for substitutionGroup="fragment" .

mixed = true is used to allow text content inside the element. src attribute will allow using external scripts.

You should now run xsd.bat file to generate serialization classes in C#. Check Fragments.cs for results.

Now we'll define markup for our tag.

@model Doxml.Xml.Script
<script src="@Model.Src">
    @if (Model.Text!=null) {
      @Html.Raw(String.Join(String.Empty, Model.Text))
    }
</script>

Great, now we are ready for some fun.

Put this in your page:

<div class="well clock">
</div>
<script src="http://momentjs.com/downloads/moment.min.js" />
<script>
  $(function() {
    setInterval(function() {
      $('.clock').text(moment().format('MMMM Do YYYY, h:mm:ss a'));
    }, 1000);
  });
</script>

And you'll get a clock like the one below.