Build a custom field control: Implement the client control

Field controls in Sitefinity CMS provide most of their functionality in client code. As the Sitefinity CMS backend where those controls are used is wholly AJAX-ified and works through services, custom field controls have to provide a client API to be called by Sitefinity CMS. Here is how to implement the client component for a custom field control.

Implement a basic client control

The client control is just a regular ASP.NET Ajax client control, that resides in a javascript file. There is a snippet in Visual Studio that can create one for you. Just open an empty JS file, type "control" in it and press Tab twice. You will need to provide the name of the control. By convention, this should be the same as the fully qualified type name of your server class.

Inherit from the FieldControl client class

You must also derive this javascript class from the FieldControl javascript class to get all base functionality. This is done in the call to registerClass, which by default uses Sys.UI.Control. Change that to Telerik.Sitefinity.Web.UI.Fields.FieldControl.

Include required properties

Sitefinity CMS expects every field control to have get_value() and set_value() client properties. They should return and save the value of the field, respectively. The implementation is up to you and depends on the UI of your custom field. For simplicity, the following code sample just returns and sets the value of a different DOM element, depending on the current mode (Read or Write).

You can notice the call to raisePropertyChanged in the set_value property. This is a convention in the MS Ajax library that you can use to notify any listeners that the value of a specific property changed.

Use the following code sample:

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Was this article helpful?