Using the Client Side API and JQuery to highlight checkboxes in the Key Attribute screens.

Hints, Tips and Tricks

Technical Hints Tips and Tricks that cover customization and development using Sage CRM. API usage and coding are covered.

Using the Client Side API and JQuery to highlight checkboxes in the Key Attribute screens.

  • Comments 4
  • Likes

Consider this image below.

The screen shows the Key Attributes tab in the company context for a customised system.  The screen shows a series of check boxes in the different categories used within the system.

A customer had a requirement for their staff to have a strong visual pointer for those checkbox fields that had been selected as shown below.

Note:  Within the screen the checkboxes are visually represented by image files rather than standard HTML checkboxes.

The Key Attributes screen does not have a Custom Content box or an obvious way of allowing the screen to be controlled by JavaScript.

The change was made by using the custom script library feature of Sage CRM that allows a script file added to the custom folder to be automatically included in the screen.

My system had an install name of CRMTraining and consequently the path to the folder was

C:\Program Files (x86)\Sage\CRM\CRMTraining\WWWRoot\js\custom

The script needed to execute automatically when the page loaded.  It needed to check whether this was the Key Attribute screen before it attempted any changes to the display of the fields.

Below is the script used.

[code language="javascript"]
crm.ready(function () {
    var queryVariables = crm.getArgs()
    if (queryVariables.Act == 1272)
        var jTags = $("img[src*='FilledCheck.gif']");
        jTags.each(function () {
            $(this).css('border', "solid 2px red");

This was edited within Visual Studio.

The code example mixed the client side API with JQuery.  The JQuery has simplified the search for the image files that represent the filled check boxes.  Once the image tags were found it was just a question of then adding styling to them for the desired effect.

  • Thanks Jeff that looks like a useful technique.  Do I have to set something to get CRM to execute scripts in the /js/custom/ folder?  I tried a simple 'Hello, World!' script but nothing happens.


  • Paul

    Create a script file in the js/custom folder.  Call it 'myscript.js'.  Make sure that it is empty.  Don't put any HTML tags in there (e.g. do not add  tags.

    Then add this to the file

    crm.ready(function () {

    crm.infoMessage("hello world");


    Save the file.  Then restart IIS.

    Log back into CRM and every screen will now display 'Hello World'.

  • Ah - "Then restart IIS" - that did the trick!

  • "Refresh Custom Objects" in Administration/System/Metadata also works.