Registering a custom editor

This document describes how to register a custom editor for a type. This can be used to define which editor to use for a specific property for a page or shared content. To create the actual editor, see Creating an Editor Widget.

Creating a simple editor

EPiServer 7 introduces a generic object editing system. This system can be used to create an editor for any .NET object. EPiServer CMS uses this system to create editors for  content like pages and shared content. The following example demonstrates how to register a custom editor for a specific type.

using EPiServer.Core;
using EPiServer.Shell.ObjectEditing.EditorDescriptors;

namespace CodeSamples.EPiServerShell.EditorDescriptors
{
    /// <summary>
    /// Editor descriptor that will create a checkbox to be able to edit boolean values.
    /// </summary>
    [EditorDescriptorRegistration(TargetType = typeof(bool))]
    public class BooleanEditorDescriptor : EditorDescriptor
    {
        /// <summary>
        /// Initializes a new instance of the <see cref="BooleanEditorDescriptor"/> class.
        /// </summary>
        public BooleanEditorDescriptor()
        {
            //The default editing class that will be used in forms editing mode.
            ClientEditingClass = "dijit.form.CheckBox";
        }
    }
}

It is also possible to define a number of settings for the editor you want to use. This example shows how to define some of the additional settings.

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using EPiServer.Editor;
using EPiServer.Shell;
using EPiServer.Shell.ObjectEditing;
using EPiServer.Shell.ObjectEditing.EditorDescriptors;

namespace CodeSamples.EPiServerShell.EditorDescriptors
{
    /// <summary>
    /// Editor descriptor that will create a select input to be able to edit float number values
    /// </summary>
    [EditorDescriptorRegistration(TargetType = typeof(float))]
    public class FloatNumberEditorDescriptor : EditorDescriptor
    {
        /// <summary>
        /// Initializes a new instance of the <see cref="PropertyFloatNumberEditorDescriptor"/> class.
        /// </summary>
        public FloatNumberEditorDescriptor()
        {
            //The default editing class that will be used in forms editing mode.
            ClientEditingClass = "dijit.form.NumberTextBox";
        }

        public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
        {
            base.ModifyMetadata(metadata, attributes);

            if (!attributes.OfType<RangeAttribute>().Any())
            {
                var constraints = new Dictionary<string, object>() 
                {
                    {"min", Double.MinValue },
                    {"max", Double.MaxValue }
                };
                //These settings will be passed to the constructor of the editor widget.
                metadata.EditorConfiguration.Add("constraints", constraints);
            }

            //Define what kind of editor we want to have, in this case we want to create an inline editor. This is used
            //when the user is in "on page editing" mode.
            metadata.CustomEditorSettings["uiWrapperType"] = UiWrapperType.Inline;
            //Specify the class for a custom editor responsible for the actual editing.
            //If not defined the default (forms) editor will be used.
            metadata.CustomEditorSettings["uiType"] = "dijit.form.NumberTextBox";
        }
    }
}