Alexander Haneng
Jan 23, 2013
  4045
(1 votes)

Getting EPiServer 6 custom properties to work in EPiServer 7: Cannot create and populate list type…

When working on getting EPiImage to work in EPiServer 7 I ran into the following error when publishing or auto saving an EPiImageGalleryProperty.

 

clip_image002

 

From the error message I guessed it had something to do with the JSON communication used in the new UI.

 

Turns out that since EPiImageGalleryProperty stores its data as an EPiImageGalleryImageCollection object, EPiServer 7 doesn’t know how to serialize it as a JSON object. But how can we tell EPiServer explicitly how to do the serialization?

 

Luckily Linus Ekström (EPiServer Sweden) helped me out with some sample code:

using System;
using EPiServer.ServiceLocation;
using Newtonsoft.Json;
 
namespace EPiServer.Cms.Shell.Json
{
    /// <summary>
    /// Json converter thas handles conversion between 
    /// <see cref="Url"/> and <see cref="string"/>.
    /// </summary>
    [ServiceConfiguration(typeof(JsonConverter))]
    public class UrlConverter : JsonConverter
    {
        public override bool CanConvert(Type objectType)
        {
            return typeof(Url).IsAssignableFrom(objectType);
        }
 
        public override object ReadJson(
            JsonReader reader, 
            Type objectType, 
            object existingValue, 
            JsonSerializer serializer)
        {
            return (reader.Value == null) ? null : 
                new Url(reader.Value.ToString());
        }
 
        public override void WriteJson(
            JsonWriter writer, 
            object value, 
            JsonSerializer serializer)
        {
            var url = value as Url;
            if (url == null || url.IsEmpty())
            {
                writer.WriteValue(string.Empty);
                return;
            }
            writer.WriteValue(value.ToString());
        }
    }
}

 

This class which inherits from JsonConverter tells EPiServer 7 how to do the conversion of a EPiServer.Url to Json (meaning a string representation) and back again.

 

I can create my own Json converter for EPiImageGalleryImageCollection like this:

using System;
using EPiServer.ServiceLocation;
using Newtonsoft.Json;
 
namespace MakingWaves.EPiImage.EPiImage.Code
{
    /// <summary>
    /// Json converter that handles conversion between 
    /// EPiImageGalleryImageCollectionConverter 
    /// and string for the new EPiServer 7 UI
    /// </summary>
    [ServiceConfiguration(typeof(JsonConverter))]
    public class EPiImageGalleryImageCollectionJsonConverter : JsonConverter
    {
        public override bool CanConvert(Type objectType)
        {
            return typeof(EPiImageGalleryImageCollection).IsAssignableFrom(objectType);
        }
 
        public override object ReadJson(
            JsonReader reader, 
            Type objectType, 
            object existingValue, 
            JsonSerializer serializer)
        {
            if (reader.Value == null)
                return null;
 
            return new EPiImageGalleryImageCollection(reader.Value.ToString());
        }
 
        public override void WriteJson(
            JsonWriter writer, 
            object value, 
            JsonSerializer serializer)
        {
            EPiImageGalleryImageCollection gallery = value 
                as EPiImageGalleryImageCollection;
            if (gallery == null || gallery.Count == 0)
            {
                writer.WriteValue(string.Empty);
                return;
            }
            writer.WriteValue(gallery.ToString());
        }
 
    }
}

 

For it to work I also needed to do the following changes to my existing EPiImage code:

1. Create a ToString method for EPiImageGalleryImageCollection that accurately serialized the data in the object to a string. As it consists of a List<EPiImageGalleryImage> I also need to:

2. Create a ToString method for EPiImageGalleryImage that accurately serialized the data in the object to a string

3. Create a constructor method for EPiImageGalleryImageCollection that could take in the serialized string as a parameter to recreate the object

4. Create a constructor method for EPiImageGalleryImage that could take in the serialized string as a parameter to recreate the object

 

If you are converting your own custom property to work with EPiServer 7, I thought this code might guide you in the right direction Smile

Jan 23, 2013

Comments

Please login to comment.
Latest blogs
Plug-in manager is back in CMS 12

Plug-in manager is back in the UI, what is it and how can i use it?

Luc Gosso (MVP) | Oct 6, 2022 | Syndicated blog

Display Child Pages in Content Delivery API Response

The below example will implement an instance of IContentConverterProvider to customise the serialisation of PageData and output child pages in the...

Minesh Shah (Netcel) | Oct 4, 2022

Bring the Report Center back in Optimizely CMS 12

The Report Center has been a part of Optimizely CMS since its first debut in version 5R2 in 2008, but in CMS 12, it's removed! Don't despair! Make...

Tomas Hensrud Gulla | Oct 4, 2022 | Syndicated blog

Customizing Property Lists in Optimizely CMS

Generic property lists is a cool editorial feature that has gained a lot of popularity - in spite of still being unsupported (officially). But if y...

Allan Thraen | Oct 2, 2022 | Syndicated blog