Access Web Services using the AJAX Toolkit

One common method of exposing Apex code in external services is by annotating it as a WebService method, which allows the code to be accessed as a SOAP web service call.

To invoke web service methods:

  1. Define your Apex code as a web service.
  2. Add the Apex AJAX Toolkit library as an external resource in your Skuid page.
  3. Use the sforce.apex.execute() function in a snippet to invoke your Apex code.
  4. Add a button to invoke your snippet.

This method is particularly useful because it can be used on any Skuid page, without the need for a separate Visualforce page or any additional Apex code (if the code’s methods have already been annotated as web services). However, there are some considerations to keep in mind:

  • You’ll need to load the AJAX Toolkit on each Skuid page that accesses Apex in this way.
  • The use of web services requires API access, which may or may not be appropriate for your security model.
  • Making calls to web services is a synchronous process. This means that your end users must wait until calls are completed before continuing their workflow.

Define your Apex code as a web service

First, ensure that you have properly annotated your Apex code.

Below is an example using a dummy Apex class that exposes two web service methods, “Prequalify” and “SubmitForProcessing”:

global class OpportunityUtils {
  webservice static String SubmitForProcessing(String opportunityId) {
    // Pre-processing
    // Callout to external webservice
    // Post-processing
    return 'Success';
  }
  webservice static String Prequalify(String opportunityId) {
    Opportunity opp;
    try {
        opp = [select OwnerId, Amount from Opportunity where ID = :opportunityId limit 1];
      } catch (Exception ex) {
          return 'Could not find Opportunity';
      }
      if (opp.Amount < 10000) {
        return 'Qualified!';
      } else {
          return 'Needs Managerial Approval';
      }
    }
}

Add the Apex AJAX Toolkit library as an external resource in your Skuid page

While Skuid always loads the base AJAX Toolkit JavaScript (/soap/ajax/[latest_version]/connection.js), you’ll need to load the Apex library in order to interface with the web service.

In Skuid:

  1. Click the JavaScript resource tab.
  2. Click the + icon to add a new resource.
  3. Change your newly-created resource’s type to “External.”
  4. For the Resource URL, use /soap/ajax/32.0/apex.js

Your page can now access the functions within the AJAX Toolkit Apex library.

Note

This must be done on all Skuid pages where you wish to leverage this Apex approach.

Use the sforce.apex.execute() function in a snippet to invoke Apex code

The key function needed to access your Apex is sforce.apex.execute(). Use it within an In-Line Snippet) resource, and include all of its three parameters:

sforce.apex.execute(class, method, {parameters})

  • class: The name of the Apex class containing your specific method
  • method: The name of the method to call
  • object parameters: The parameters for the Apex method you’ll be accessing

Now, let’s add a new snippet called “Prequalify,” which will call the Prequalify web service in our OpportunityUtils class, passing in a parameter “opportunityId.” This contains the ID of the target Opportunity record.

Here’s the structure of the JavaScript snippet:

var OpportunityModel = skuid.model.getModel('Opportunity');
var OpportunityRow = OpportunityModel.data[0];

var result = sforce.apex.execute(
  'OpportunityUtils',
  'Prequalify',
  {
      opportunityId: OpportunityRow.Id
  }
);

alert('Result: ' + result)

UA97SkuidApex-1

Add a button to invoke your snippet

  1. Drag a Button Set (or Page Title) component into the canvas.
  2. On the component, add a new button:
    • Button Type “Custom: Run Skuid Snippet.”
    • Label: Prequalify
    • Button icon: Choose one
    • Snippet Name: in this example, we’re calling the “Prequalify” Snippet.

UA97SkuidApex-2

The final result: A button that runs your Apex web service on the selected Opportunity, and returns the result.

UA97SkuidApex-3