Header sample.gif

S-Controls

Note: S-controls have been superseded by Visualforce pages. For more information, please visit S-Control_Deprecation


This S-control is an example of how to use AJAX and JavaScript to add functionality to a standard page.

It adds a "Related Contacts" pull-down list to the Contacts page, showing other contacts with the same email domain (eg @company.com). This is useful when you wish to find related contacts that might not be attached to the same Account.


Related contacts.png


  • Selecting a contact from the list will jump to that contact page.
  • A "Show All" option displays a search screen for all contacts with that email domain

This sample code demonstrates how to supplement a normal page with additional information, while maintaining a familiar user interface.

Installation:

  • Create a new S-Control
  • Paste the code below directly into the S-control
  • Save the S-Control (Type: HTML)
  • Go to your Contact Page Layout
  • Drag the new S-Control onto the layout
  • Double-click the field, set Height to 22 and Tick "Show label"
  • Save
  • Make sure your Users have a Profile with ""API Enabled"" turned ON

To test: Go to a Contact that shares an e-mail address with another Contact (eg fred@gmail.com and jim@gmail.com). The pull-down menu should appear.

Want to exclude certain domains (eg msn.com)? Take a look at the related topic in the discussion forums.

<html> 
<head> 
<script src="/soap/ajax/12.0/connection.js" type="text/javascript"></script> 
</head>

<body bgcolor=#f3f3ec>
<select id="contacts" onchange="related_contact(this)">

<script>

function related_contact(contact)
{
  // If a user is selected, show them!
  top.location.href =  "/" + contact.options[contact.selectedIndex].value;
}

// Find Contacts with same email domain
domain = "{!Contact.Email}".split("@")[1];
related_contacts = sforce.connection.query(
      "select Name, Email, Id from Contact where Email like '%@"
      + domain + "' and Id != '{!Contact.Id}' ");

// Show them
var list = document.getElementById('contacts');
if (related_contacts.size == 0)
  list.style.display = 'none' 
else
{
  // Show them in a pull-down list
  var option = document.createElement('option');
  option.text = related_contacts.size + " Contact"
       + (related_contacts.size> 1 ? "s" : "") + " with similar email address:";
  try { list.add(option, null) } catch (ex) { list.add(option) }  // For IE

  // Look through each Contact and add the to the list
  records = related_contacts.getArray("records"); 
  for (var i=0; i < records.length; i++)
  {
    option = document.createElement('option');
    option.value = records[i].Id;
    option.text = records[i].Name + " ("+ records[i].Email + ")";
  try { list.add(option, null) } catch (ex) { list.add(option) }  // For IE
  }

  // Finally, add an option to go to the Search screen and look for the email domain
  option = document.createElement('option');
  option.value = "search/SearchResults?sen=003&sbstr=" + domain;
  option.text = "Show All";
  try { list.add(option, null) } catch (ex) { list.add(option) }  // For IE
}

</script> 
</body> 
</html>

This sample code was provided by John Rotenstein (john.sf@john.balgara.com). Reuse encouraged.