Client module

Configuration elements of the Client module type are separate functionality blocks you can upload and run on demand. The purpose of the client module is front-end Creatio development.

Client modules have the following types:

• non-visual module
• visual module
• replacing module

Learn more about client module types in a separate article: Module types and their specificities.

The items of the Add drop-down list in the toolbar of the Configuration section workspace represent the client module types you can add in Creatio IDE.

View the client module types in the figure below.

Learn more about configuration element types in a separate article: Operations in Creatio IDE.

The Client module type schema in the Type drop-down list in the toolbar of the Configuration section workspace represents the client module. A schema is the basis of Creatio configuration. As far as software implementation is concerned, a schema is a core class inherited from the base Schema class.

View the type of the client module schema in the figure below.

Learn more about configuration element types in a separate article: Operations in Creatio IDE.

Implement a non-visual module 

The Module schema type represents a non-visual module.

To implement a non-visual module:

1. Go to the Configuration section and select a custom package to add the schema.

2. Click Add → Module on the section list toolbar.

   

3. Fill out the schema properties in the Module Designer.

   The main schema properties are as follows:

   • Code is the schema name. Required. Starts with the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting, Usr by default. Can contain Latin characters and digits. When a configuration element schema is created, the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting is added to the current field automatically. Creatio checks for the prefix and whether it matches the system setting value when saving the schema properties. If the prefix is missing or does not match, the user receives a corresponding notification.
   • Title is the localizable schema title. Required. The title of the configuration element schema is generated automatically and matches the value of the Code property without the prefix.
   • Package is the custom package where you create the schema. The property is populated automatically and non-editable.
   • Description is the localizable schema description.
   

   Click Apply to apply the properties.

   The properties area of the Module Designer lets you:

   • edit the main schema properties ( button)
   • specify the additional schema properties ( button)

   The additional schema properties are as follows:

   • Localizable strings
   • Messages
   • Images
   • Parameters

4. Add the source code in the Module Designer. The module name in the define() function must match the schema name in the Code property.

   Creatio displays the type of the error or warning – if any – to the left of the row number. Hover over the error type to view a tooltip with the error description.

5. Click Save on the Module Designer’s toolbar.

Implement a visual module 

The visual module types are as follows:

• Freedom UI page, available for Creatio 8 Atlas and later
• Page view model
• Section view model
• Detail (list) view model
• Detail (fields) view model

Freedom UI page schema 

1. Go to the Configuration section and select a custom package to add the schema.

2. Click Add → Freedom UI page on the section list toolbar.

   

3. Depending on your goals, select the corresponding template of the Freedom UI page to add and click Select.

   

4. Click in the action panel of the Freedom UI Designer and fill out the schema properties in the setup area.

   The schema has the following properties:

   • Page title is the localizable schema title.
   • Configuration title is the schema name. Required. Starts with the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting, Usr by default. Can contain Latin characters and digits. When a configuration element schema is created, the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting is added to the current field automatically. Creatio checks for the prefix and whether it matches the system setting value when saving the schema properties. If the prefix is missing or does not match, the user receives a corresponding notification.
   • Package is the custom package where you create the schema. This is a non-editable field.
   • Description is the localizable schema description.
   

5. Click in the action panel of the Freedom UI Designer. The Module Designer opens after you save the page settings.

   The properties area of the Module Designer lets you:

   • edit the main schema properties ( button)
   • specify the additional schema properties ( button)

   The main schema properties are as follows:

   • Code is the schema name. Required. Matches the Configuration title properties specified in the Freedom UI Designer.
   • Title is the localizable schema title. Required. Matches the Page title property specified in the Freedom UI Designer. When a configuration element schema is created, the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting is added to the current field automatically. Creatio checks for the prefix and whether it matches the system setting value when saving the schema properties. If the prefix is missing or does not match, the user receives a corresponding notification.

   • Parent object is the object whose properties the module inherits. Creatio populates the property automatically based on the template selected when adding the Freedom UI page in the Configuration section. This is an editable field.

     Attention. We do not recommend editing the Parent object property after you add elements to the schema. This can cause page malfunction.

   • Package is the custom package where you create the schema. Matches the Package property specified in the Freedom UI Designer. The property is populated automatically and non-editable.
   • Description is the localizable schema description. Matches the Description property specified in the Freedom UI Designer.
   

   Click Apply to apply the properties.

   The additional schema properties are as follows:

   • Localizable strings
   • Images
   • Parameters

6. Add the source code in the Module Designer. The module name in the define() function must match the schema name in the Code property.

   Creatio displays the type of the error or warning – if any – to the left of the row number. Hover over the error type to view a tooltip with the error description.

7. Click Save on the Module Designer’s toolbar.

View model schema 

1. Go to the Configuration section and select a custom package to add the schema.

2. Click Add on the section list toolbar and select the type of the view model schema.

   

3. Fill out the schema properties in the Module Designer.

   The main schema properties are as follows:

   • Code is the schema name. Required. Starts with the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting, Usr by default. Can contain Latin characters and digits. When a configuration element schema is created, the prefix specified in the Prefix for object name (SchemaNamePrefix code) system setting is added to the current field automatically. Creatio checks for the prefix and whether it matches the system setting value when saving the schema properties. If the prefix is missing or does not match, the user receives a corresponding notification.
   • Title is the localizable schema title. Required. The title of the configuration element schema is generated automatically and matches the value of the Code property without the prefix.
   • Package is the custom package where you create the schema. This is a non-editable field.
   • Parent object is the object whose properties the module inherits. Select the parent object whose properties to inherit in the drop-down list.
   • Description is the localizable schema description.
   

   Click Apply to apply the properties.

   The properties area of the Module Designer lets you:

   • edit the main schema properties ( button)
   • specify the additional schema properties ( button)

   The additional schema properties are as follows:

   • Localizable strings
   • Images
   • Parameters

4. Add the source code in the Module Designer. The module name in the define() function must match the schema name in the Code property. The view model schema inherits from the BaseModulePageV2 base schema.

   Creatio displays the type of the error or warning – if any – to the left of the row number. Hover over the error type to view a tooltip with the error description.

5. Click Save on the Module Designer’s toolbar.

Implement a replacing module 

The Replacing view model schema type represents the replacing module.

To implement a replacing module:

1. Go to the Configuration section and select a custom package to add the schema.
2. Set up the package dependencies. You must add the package that contains the replaced client module to the dependency list.

3. Click Add → Replacing view model on the section list toolbar.

   

4. Select the parent object in the Module Designer.

   To replace a section or page with the module, specify the view model schema to replace in the drop-down list of the Parent object required property. For example, to create a replacing schema for the Contacts section, specify the ContactSectionV2 schema as the parent object.

   

   After you select the parent object, Creatio populates other module properties automatically.

   

   Click Apply to apply the properties.

   The properties area of the Module Designer lets you:

   • edit the main schema properties ( button)
   • specify the additional schema properties ( button)

   The additional schema properties are as follows:

   • Localizable strings
   • Images
   • Parameters

5. Add the source code in the Module Designer. The source code must implement the functionality that distinguishes the replacing client module from the replaced module. The module name in the define() function must match the schema name in the Code property.

   Creatio displays the type of the error or warning – if any – to the left of the row number. Hover over the error type to view a tooltip with the error description.

6. Click Save on the Module Designer’s toolbar.

Learn more about replacing configuration elements in a separate article: Replace configuration elements.