Nibble

Usercontrolwrapper and storing parseable xml data

More detailed post related to the ‘master of datatypes’ session on the fact that it is possible to store parseable xml data on your custom datatypes using the usercontrolwrapper.

A feature that was added to the usercontrolwrapper since the umbraco Juno release (4.6) was that if you returned some xml (as a string) it will recognize this and store it as parseable xml data (like the related links datatype or the image cropper datatype, basicly datatypes that store rich data, not just a single value). By storing this as xml it’s easy to work with in both xslt and razor.

As a final piece to the puzzle we also added some helper methods that you can use to serialize an object to xml, found in the umbraco.editorControls.userControlGrapper.SerializationHelper namespace (so no need to write custom to xml methods but simply use the helper methods).

Here is an example:

    public partial class MultipleValuesDatatype : System.Web.UI.UserControl
        , umbraco.editorControls.userControlGrapper.IUsercontrolDataEditor
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
                customControl.Values = _umbval;
        }
 
        private List<string> _umbval;
        public object value
        {
            get
            {
                return SerializationHelper.ValueToXmlString(customControl.Values);
            }
            set
            {
                if (value != null && string.IsNullOrEmpty(value.ToString()))
                    _umbval = new List<string>();
                else
                {
                    _umbval = 
                        (List<string>)SerializationHelper.ValueFromXmlString(
                            value, 
                            typeof(List<string>));
                }
            }
        }
    }

The object get’s serialized (it’s of the type list<string> in this case) and the xml representation of the object gets stored.

If you take a look at the xml cache (open the /app_data/umbraco.config file) you can see how the xml representation looks (where openingHours is the alias of the property)

 <openingHours>
      <ArrayOfString 
              xmlns:xsd="http://www.w3.org/2001/XMLSchema" 
              xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
        <string>Friday: 20</string>
        <string>Saterday: 21</string>
      </ArrayOfString>
</openingHours>

So in this case I get an ArrayOfString element with a string element for each of the values.

To output this on our frontend we can use some xslt or since the razor implementation in Umbraco 4.7 has awesome support for xml properties we can also use some razor:

<umbraco:Macro runat="server" language="cshtml">
  <ul>
  @foreach(var value in Model.openingHours)
  {
    <li>@value.InnerText</li>
  }
  </ul>
</umbraco:Macro>


So as you see the latest updates to the usercontrol wrapper (configuration with data editor settings and the parseable xml support) make it a lot more useful and there should hardly be a need for using anything else when you want to create a custom Umbraco datatype

Download the entire sourcecode here

7 Comments so far

  1. Byron on March 28th, 2011

    This sounds very useful. What about embedding html text as CDATA in the xml?

  2. Adam Lipinski on April 15th, 2011

    I’ve tried to implement this exact control in my own project and I am getting the following error when accessing the control on a content page: Could not load type ‘umbraco.editorControls.userControlGrapper.SerializationHelper’ from assembly ‘umbraco.editorControls, Version=1.0.4029.29222, Culture=neutral, PublicKeyToken=null’.

    Any ideas what’s wrong?

  3. Tim Geyssens on April 18th, 2011

    @Adam, you need to be using at least version 4.7 of umbraco since older versions don’t have the serialzationhelper

  4. Jason Nash on April 19th, 2011

    Hello,

    I am Jason and I represent the most trusted low-cost web hosting reviews in the market.
    I am really amused with the way you present your ideas/concepts on your site.

    Would you be open in discussing a sensible business proposal or some sort of sponsorship?

    Thanks,

    Jason Nash

  5. Marc on August 1st, 2012

    Hi, thanks for this article, I am using it to create my own custom datatype. How do you look the ArrayOfString using XSLT and not Razor?

    Cheers,

    Marc

  6. Marc on August 1st, 2012

    Sorry that was meant to say ‘loop’ not ‘look’

  7. siva on June 17th, 2013

    I created a user control ,which contains textbox,upload control and checkbox. can i save all the values in database or in xml format?how to do this using abstract data editor and user control wrapper in umbraco 4.7.1.1?

Leave a Reply