Implement the client component for the simple widget designer

You must store the client component in a .js file in the project, where the designer resides.
To implement the client component, perform the following:

  1. Add a new .js to the project of your designer.
    You can name the file the same way as the class. 
    For example, if the class is named SimpleWidgetDesigner.cs, name the file SimpleWidgetDesigner.js.
  2. In the context menu of the .js file, click Properties.
  3. In Properties pane, set the BuildAction field to EmbeddedResource.
  4. Open the .js file.
  5.  Create the namespace for the client code.
    This is done by calling the registerNamespace of the Type class.

    NOTE: You must use the same namespace throughout the entire client code of this file.

  6. Define the client class.
  7. Define the prototype for the class by including the following methods:
    • initialize
      This method is called when an instance of the class is created. In it, you must call the initialize method of the ControlDesignerBase class.
    • dispose
      This method is called when the instance of the class is no longer used. In it, you must call the dispose method of the ControlDesignerBase class.
    • refreshUI
      This method is called when the designer is opened. In it you must get an instance of the widget and populate the UI with the values of the properties of the widget.
    • applyChanges
      This method is called when the changes must be applied to the widget. In it you must get an instance of the widget and set its properties to the new values in the UI.
  8. Register the client class and specify its base class.
    This is done by calling the registerClass method. You must pass the Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase as the base class.

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.

Web Security for Sitefinity Administrators

The free standalone Web Security lesson teaches administrators how to protect your websites and Sitefinity instance from external threats. Learn to 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?