Extending Sitecore Field Types

Introduction

Sitecore Field Types have predefined behaviour that sometimes may limit the solution to your needs. An example is the datasource of a List-Type where you may need to set it with different parameters depending on the item selected.

In my case, I want my datasource to add the item's parent name to the path. For example, if I select '/sitecore/content/home/products/product1', I want the datasource of a GroupedDroplink to be '/sitecore/content/global/Types/products' and if I select '/sitecore/content/home/services/service1', then I want the datasource to be '/sitecore/content/global/Types/services'.

In order to do this, I want to be able to add a new keyword to the path: @@parentname. So my datasource would be: '/sitecore/content/global/Types/@@parentname'. My extended type should then replace the keyword with the actual parent name of the selected item.

Luckily, Sitecore allows extending of built-in Field Types in a relatively very easy way. This tip will show you in a step-by-step basis how to do this.

Creating the Field Type Class

We start by creating a new extended Field Type Class in our project.

Add a new class in an appropriate location for your customizations and extensions and name it something appropriate, an example would be ExtendedGroupedDroplink since I will be extending the GroupedDroplink type.

This class must inherit from the type we're extending, so in this case GroupedDroplink:

public class ExtendedGroupedDroplink : Sitecore.Shell.Applications.ContentEditor.GroupedDroplink
   {

Inside our class, override the base method 'DoRender' and add the functionality you would like. In my case, I add the following logic:

protected override void DoRender(System.Web.UI.HtmlTextWriter output)
{
    //Get the selected item from the base.ItemID
    var item = Sitecore.Context.ContentDatabase.GetItem(base.ItemID);

    //Update the source of the field type by replacing the new keywords we added
    //In this case only the @@parentname keyword with the selected item.Parent.Name
    Source = Source.Replace("@@parentname", item.Parent.Name);

    //Then let the DoRender function as normal
    base.DoRender(output);
}

Make sure you add a reference to System.Web if this is a separate project from the main Web Application project.

Note: I suggest you add a breakpoint now at the beginning of this method to test it when it is triggered.

Adding the ExtendedGroupedDropLink to Sitecore UI

After completing the coding needed, we need to add this class to Sitecore as a new Field Type, to do this follow the instructions given below:

1. Switch to Core DB:

   

2. From Core DB's Content Editor, locate '/sitecore/system/Field Types/' and then open the folder related to your Field Type being extended. In my case under 'List Types'.
3. In the related folder, add a new item from the Template '/sitecore/templates/System/Templates/Template field type' and give it a proper name such as ExtendedGroupedDroplink.

   

4. Under the 'Data' section, fill the 'Assembly' field with the assembly name of your project that your extending class is located in, and fill the 'Class' field with the full name of the class (with the namespace). In my example, my assembly is called 'Common' and my full class name is 'Common.CustomFields.ExtendedGroupedDropLink'.

   

5. Save the new item and then go back to the Master DB.

   At this point, your new field should be included in the list of Sitecore types. If you go back to your template, you should find a new Field Type.

   

   Select the new 'ExtendedGroupedDropLink' and add a datasource with the new added keyword, in my case '/sitecore/content/global/Types/@@parentname' and then go to one of the items created using this template. Once the item is loaded, the overridden method should get triggered. If you are running Sitecore from VS, the breakpoint should be triggered.

   After the class has been executed, the list should be filled with data according to your new datasource after replacing the '@@parentname' with the actual name of the parent item: '/sitecore/content/global/Types/products' for example.

Note: I did the above using Sitecore v7.2 and I upgraded my sitecore using the upgrade packages all the way to v8.1 and the control still works.