System Administrator Help
> Customization > Screens > Advanced screen customization > Customizing screens with the client-side API

Customizing screens with the client-side API

The Sage CRM client-side API functions give you customization capabilities across three main areas of screen and list customization. For more information, see the Developer Help on the Sage CRM Help Center.

  • Field Level functions - changing the way specific fields on a page behave. For example, setting a background color or hiding a field.
  • Page Level functions - changing the way parts of a screen behave. For example, setting an error message, or adding a Print button to a screen.
  • Advanced functions - these can be used in conjunction with other API calls, for example, to make date comparisons.
Client-side scripting is a tool for easily customizing the appearance of CRM screens and lists to suit the way your users work. It is not a substitute for effective data validation or security on your system. This should be still be handled by the existing security features of Sage CRM.

You can add the functions in the following areas:

  • <My Profile> | Administration | Customization | Primary Entities / Secondary Entities | <Entity> | Screens | OnChange Script. Use this field if you want the event to occur only when a specific field is changed. For example, displaying a warning message to the user when the company name is changed. However, you may find it easier to add all your code for a screen in the Custom Content field, and then reference a specific function from the OnChange Script field associated with a particular field.
  • <My Profile> | Administration | Customization | Primary Entities / Secondary Entities | <Entity> | Screens | Custom Content. The code is activated when the whole screen is in Edit (or View) mode. Code in the Custom Content field must be enclosed in <script></script> tags.
  • <My Profile> | Administration | Customization | Primary Entities / Secondary Entities | <Entity> | Lists | Custom Content. The code is activated when the list or grid is viewed.
  • In an external .JS file in the ..WWWROOT\JS\CUSTOM folder of your install. JavaScript files placed in this folder are automatically included on most CRM screens - the Interactive Dashboard and the Logon screen are not included. This means that you can put all your custom functions in a centralized .JS file. Then, to apply the code to a specific area of CRM, just reference the function from one of the places mentioned above. This makes it easier to keep the customizations in a central location with fewer changes to the CRM screens.

You should follow these basic guidelines.

  • If you are adding the code in Custom Content, it must be enclosed with <script></script> tags in this format:

    <script>
    crm.ready(function()
    {
    // Add your script here
    });
    </script>
  • If you are adding the code in OnChange Script, it does not need to be enclosed with <script></script>.
  • Use single quotes only in the OnChange Script field. This also applies to the OnChange Script field in Workflow Customization actions Set Column Value, Reset Column Value, and Display Fields for Amendment.
  • If you want to try the sample code, please remove any special character formatting which will interfere with the code before pasting into CRM. Pasting into Notepad or a similar text editor before copying and pasting for use with Sage CRM is a good way to do this.
  • Make sure the first character of the Client-Side API function is lower case. For example, crm.markRequiredFields.