Creating UI settings for dynamic content

Introduction

When developing dynamic content functionality you may well want the editor to enter some settings when they add the dynamic content to a page. To create UI settings for dynamic content in EPiServer, you have the following options:

• Automatically Using a PropertyDataCollection
• Creating Settings with a User Control

Using a PropertyDataCollection automatically

If you just want some simple fields, actually any field that is a property in EPiServer, you can use a PropertyDataCollection that automatically will be rendered in the settings UI for this dynamic content. When you create a dynamic content plug-in you inherit from an interface called IDynamicContentBase. One member of IDynamicContentBase is:

public PropertyDataCollection Properties
{
    get;
}

Any PropertyData in the collection will be rendered for the editor to see and change. The collection will also be updated with any changes the editor makes.

Creating settings with a user control

If you want a more advanced settings UI, or just want more control, you can load your own user control. That is done by adding an attribute to your dynamic content, and supplying a Url attribute:

[GuiPlugIn(Url = "~/MyDynamicContentSettings.ascx", Area = PlugInArea.DynamicContent)]
public class MyDynamicContent : IDynamicContent

DynamicContentEditControl

The dynamic content settings control needs to inherit from DynamicContentEditControl:

public partial class MyDynamicContentSettings : DynamicContentEditControl

DynamicContentEditControl is an abstract class that supplies your class with one property, DynamicContent, and forces you to implement one method PrepareForSave(). The DynamicContent property will give you a reference to your dynamic content and PrepareForSave() will be called when the user clicks on the OK-button in the settings UI. Here is a sample of how they can be used on an edit control:

 public override void PrepareForSave() 
   {
     ((MyDynamicContent)DynamicContent).Name = NameTextBox.Text; 
     ((MyDynamicContent)DynamicContent).Age = AgeSelector.Value;
   }

In the example above MyDynamicContent has two properties, Name and Age. They are given values from the control located in the markup. Then MyDynamicContent plugin should then handle the values. It is also the responsibility of MyDynamicContent to take care of the persisting of internal state. That is done through the implementation of the State property.