This is a simplified and specialised set of code libraries that will allow easy screen customizations.

The API is based on the JQuery syntax although I must stress that knowledge of JQuery is not needed in order to use the API.

The API is included as part of the full product development cycle and therefore is part of the formal QA process. The new API is an important new option for partners developing extensions and customization that will work in the new and future releases of Sage CRM. The API provides safe and supported options for customizing the new frameless interface.

The intention is to make it much easier to use than either raw JavaScript or JQuery as knowledge of the underlying screen structure is not needed. It should be easy and quick to extend Custom Content behaviour.

You can start to play with the API in Sage CRM just by opening up a JavaScript console in a browser.

In Chrome, logon to CRM and Navigate to the page in Sage CRM with which you want to experiment.

Press CTRL+SHIFT+I to open the Javascript Console.

You can see from the above example the syntax is very simple

• crm.fields().highlight();

This will return all of the fields in screen and apply a default highlighting to them.

Some more that you may want to experiment with are below

crm.fields('comp_name')

This allows a single field to be selected by calling the fields method with it's full name as a parameter.

crm.fields('comp_name comp_type')

This allows multiple fields to be selected by sending a list separated by spaces

crm.fields('!comp_name !comp_type')

In this example all fields except the comp_name and comp_type field have been selected

crm('comp_name')

This is a simple shortcut that allows you to select fields by calling the crm function with the selector string

You can see from the example below how the code in browser can be written. The business rule being implemented is

"If the company status is switched to 'Closed' then highlight the field in red".

In the Sage CRM Client Side API you no longer even have to think about the browser version and the whole job of finding the element that you wish to affect is easy.

Example

If you would like to experiment with the API further below are some more of the methods.

• value() — get value (code)
• text() — get text of field (translation)
• val(123) — set value
• cid() — get currency id
• caption() — get field caption
• caption('hello') —set field caption
• hide() — hides fields
• collapse() — collapses fields
• show() — shows fields
• highlight() — highlight field (defaults to yellow)
• highlight('pink')
• highlight(false) — remove highlight
• background('blue')
• bold() — embolden the text
• bold(false) — remove bold
• italic()
• underline()
• strike() - strikethrough
• strike(false)
• color('blue') — set font color
• fontSize(n) — where n is an integer number of pixels
• fontSize() — remove formatting
• title('text') — make a tooltip for a field
• title() — remove the title