Advanced property editors for Umbraco v7, strongly typed values in your views using PropertyValueConverters

As you could see in the previous post, if we have a prop editor where the value type is set the JSON we can also iterate this in your razor views

@foreach(var row in CurrentPage.matrix)
@foreach(var val in row)

Of course the type of object in this case is dynamic but a little thing called PropertyValueConverters make it possible to convert this into a strongly typed object!

Here is an example implementation

    [PropertyValueCache(PropertyCacheValue.All, PropertyCacheLevel.Content)]
    public class MatrixValueConverter : PropertyValueConverterBase
        public override bool IsConverter(PublishedPropertyType propertyType)
            return propertyType.PropertyEditorAlias.Equals("Nibble.MatrixEditor");
        public override object ConvertDataToSource(PublishedPropertyType propertyType, object source, bool preview)
            if (source == null) return null;
            var sourceString = source.ToString();
            if (sourceString.DetectIsJson())
                    var obj = JsonConvert.DeserializeObject<string[][]>(sourceString);
                    var matrix = new Matrix();
                    var rows = obj.Select(r => new Row {Values = r.ToList()}).ToList();
                    matrix.Rows = rows;
                    return matrix;
                catch (Exception ex)
                    return null;
            return sourceString;

That turns our json data into a custom Matrix object that looks like

    public class Matrix
        public IEnumerable<Row> Rows { get; set; }
        public Matrix()
            Rows = new List<Row>();

And the Row class looks like

    public class Row
        public IEnumerable<string> Values { get; set; }

        public Row()
            Values = new List<string>();

So now when I deploy this to my site when I fetch the value of a property that is using my custom matrix prop editor I’ll get an object of type Matrix Smile

If I then cast I get intellisense in Visual studio!


or you can also use Model.Content.GetPropertyValue<type>(“propAlias”)


Code for this is up on github

Just a small gotcha, currently in the RC release you’ll have to remove the JSON value type from your custom prop editor if you want to attach a custom prop value convertor but that should be solved soon

10 Comments so far

  1. Stephan on November 20th, 2013

    With upcoming strongly typed models, it should be possible to write:
    foreach (var row in Model.Content.Matrix.Rows)

  2. Jeroen Breuer on November 20th, 2013


    You can do it like this:

    foreach (var row in Model.Content.GetPropertyValue(”matrix”).Rows)

  3. Jeroen Breuer on November 20th, 2013

    My comment was changed. It should be like this without the spaces:

    foreach (var row in Model.Content.GetPropertyValue(”matrix”).Rows)

  4. Jeroen Breuer on November 20th, 2013

    Ok that also failed…

  5. Niels Hartvig on November 20th, 2013

    @Jeroen: Post a link to a gist perhaps?

  6. Tim Geyssens on November 20th, 2013

    @Niels I updated the post with Jeroens suggestion :)

  7. Florian on November 20th, 2013

    Looks great! @Jeroen Breuer, what’s that about strongley typed models? Could someone give my more details or a link or so. Thanks

  8. Tim Geyssens on November 20th, 2013

    @Florian updated the post with Jeroens example

  9. Jamie Pollock on November 20th, 2013

    Looking good, Tim! I can’t wait to try this out soon.

  10. Lars-Erik on December 1st, 2013

Leave a Reply