Extension pointers - JS SDK Series #1: Learn how to invoke a REST API function from a widget using the execute method

Software development kits (SDK) are sets of tools that are useful when building applications on a platform. They wrap up APIs in the form of libraries, and include sample code, utilities, and documentation that guides you in building your applications.

In our earlier posts we discussed building embeddable widgets for Zoho CRM. These widgets help to seamlessly integrate Zoho CRM with other applications and provide contextual information along with the application's data. Zoho CRM provides the JS SDK bundled with the necessary APIs and utilities to build these widgets using JavaScript. It serves as a mode of interaction between the JavaScript code and Zoho CRM. Through this JS SDK series of extension pointers, we aim to help you gain a deeper understanding of JS SDKs, and how to build efficient extensions.

The JS SDK bundle of Zoho CRM APIs is significant in helping you develop powerful widgets using JavaScript.

The Zoho CRM JS SDK, includes most of the APIs that help you operate with Zoho CRM data. It also includes event listeners that are useful for registering your application's events. The JS SDK also provides support to manage your widget's UI, handle configurations and connections with third party applications, and more. We're going to look at the different options available in the JS SDK, one at a time, throughout this series.

In this post, let's take a look at the ZOHO.CRM.FUNCTIONS.execute() function, its benefits,and how it can be incorporated while building extensions. It's designed to help you invoke and execute a custom function from a widget. Only a standalone REST API function can be invoked from your widget. A few major pointers regarding this API are:

➤ The ZOHO.CRM.FUNCTIONS.execute() function lets you invoke only the REST API function from a widget

➤ It requires that you input the API name of the function along with the constructed set of request data

Syntax

ZOHO.CRM.FUNCTIONS.execute(func_name, req_data)

Here, 'func_name' is the API name of the REST API function. 'req_data' is the constructed argument set that needs to be passed to the function.

Example

var func_name = "sample_function";

var req_data ={

"arguments": JSON.stringify({

"Company" : "Zoho",

"Email" : "saxxxx@xxxxx@.com",

})

};

ZOHO.CRM.FUNCTIONS.execute(func_name, req_data)

.then(function(data){

console.log("REST API function invoked from widget."+data);

})

Here, 'sample_function' is the API name of the REST API function. The arguments, namely 'Company' and 'Email',are constructed and passed as the 'req_data' parameter to the ZOHO.CRM.FUNCTIONS.execute() function.

Now let's see how the execute function can be incorporated while creating widgets to build an extension.

Note: Widgets are embeddable GUI components that help extend Zoho CRM's functionality. To get detailed information on widgets and how they work,please refer here.

To demonstrate the use of ZOHO.CRM.FUNCTIONS.execute(), let's assume a scenario in Zoho CRM involving raised product issues or concerns are registered as Cases by an organization. In general, cases originate through different modes, for example through phone, web, or email. Let's build a widget with a customized UI that allows a user to key in certain values pertaining to the 'Cases' module. This widget will fetch the necessary values and pass them to a REST API function that will create a record in the Cases module. This could help the support user on a phone call with the client to quickly build a case by filling out only the specific details.

Code snippet:

sdkwidget.js

Util={};

//assigning api name of REST API function to 'func_name' parameter of the execute function

var func_name="jssdkextension__executesdkfunction";

Util.check=function()

{

console.log("inside function");

//fetching the values provided in the UI

var subject = document.getElementById("subject").value;

var phoneno = document.getElementById("phnumber").value;

var email = document.getElementById("email").value;

var x = document.getElementById("cases").selectedIndex;

var x1 = document.getElementById("cases").options;

var cases=x1[x].text;

var y = document.getElementById("status").selectedIndex;

var y1 = document.getElementById("status").options;

var status=y1[y].text;

//constructing the 'req_data' parameter with the values fed by the user through the UI

var req_data ={

"arguments": JSON.stringify({

"sub" : subject,

"phone" : phoneno,

"cases" : cases,

"status" : status,

"email" : email

})

};

//Invoking the execute function to execute the REST API function

ZOHO.CRM.FUNCTIONS.execute(func_name, req_data).then(function(data){

var resp=JSON.stringify(data);

})

}

executesdkfunction Rest API function

//retrieving the parameters of the request

params = crmAPIRequest.get("params");

//retrieving the set of values from 'arguments' passed as 'req_data' in the javascript code

args = params.get("arguments");

data = Map();

sub = args.get("sub");

phone = args.get("phone");

caseorigin = args.get("cases");

status = args.get("status");

email = args.get("email");

data.putAll({"Subject":sub,"Phone":phone,"Case_Origin":caseorigin,"Status":status,"Email":email});

//creating a new record in the Cases module

resp = zoho.crm.createRecord("Cases",data);

}

return args;

The highlighted text in the code snippet above is used to fetch the values provided by the user through the variable 'arguments' that is passed as the 'req_data' parameter to the REST API function.

Note: You can obtain the API name of the function from the sandbox URL or production URL obtained while using the option 'Invoke as REST API' in the script editor function.

Sample Output of Widget Screen

A new record is inserted in the Cases module according to the inputs provided.

Hope you found this information useful! For more about JS SDKs, keep following this space.

Extension pointers: Working with widgets to power-up extension capabilities (Part-2)

<<Previous Next>>

New to Zoho LandingPage?

Access Zoho LandingPage

Zoho LandingPage Resources

New to Zoho Survey?

Access Zoho Survey

Latest Feature Updates

Explore our Pricing & Plans

Zoho Survey Resources

Android Mobile Surveys

Insurvey Blogs

Insight Blogs

Tips & Tricks

New to Zoho CRM Plus?

Deliver unforgettable customer experiences

ACCESS ZOHO CRM PLUS

New to Zoho CRM Plus?

Deliver unforgettable customer experiences

ACCESS ZOHO CRM PLUS

New to Zoho Marketing Plus?

Everything you need to run your marketing

ACCESS ZOHO MARKETING PLUS

New to Zoho Marketing Plus?

Everything you need to run your marketing

ACCESS ZOHO MARKETING PLUS

New to Bigin?

Signup Now

Access Bigin

Latest Feature Updates

Zoho Desk Resources

Desk Community Learning Series
Digest
Functions
Meetups
Kbase
Resources
Glossary
Desk Marketplace
MVP Corner
Word of the Day

Tout forum

France ZUGs

Zoho SalesIQ Resources

Sticky Posts
Extension pointers for integrating Zoho CRM with Zoho products #8: Upload and manage Zoho Workdrive folders and files from within Zoho CRM
Keeping records on your customers and business prospects is essential for tracking data, conducting follow-ups, and running a business smoothly. When you use two separate applications, and store relevant data in each, checking and tracking data becomes
Extension pointers: Handle cases with personalized solutions using custom actions
In our last post, we detailed the steps involved in creating a custom action and the workflow from the developer and end user's side. Now let's look at a working example of how we can create a custom action and implement it in a Zoho CRM account to make
Extension pointers - Simple yet significant pointers #13: On change of field value for CRM variables
CRM variables provide global access to a variable across an entire extension. They also help in the storage of user-specific data provided by the user at the time of installation, which can later be fetched to perform data functionalities. Additionally,
Extension pointers: Extend end-user benefits and allow personalization by implementing extensions with custom actions
From our earlier post on custom actions, we know that we can create templated actions, share them with end users, and allow them to reuse those actions to achieve personalized outcomes. In this post, we'll look at how custom actions make it easy for users
Extension pointers - Simple yet significant pointers #12: Functions for Zoho CRM extensions
Functions are essential in achieving logical functionality for an extension. You can easily code your functions in Deluge using drag-and-drop tools to meet your requirements. How to create functions for Zoho CRM extensions in Sigma Go to Sigma and select