Using Functions in Client Script

Hello everyone!

Welcome back to another interesting Kaizen post. In this post, we can discuss how to invoke Functions using Client Script and how to handle Timeouts in Client Script. This post will answer the question raised in the post, Why Client Script is not running after function execution?

In this Kaizen post,

1. What are Functions in Zoho CRM?
2. How to Invoke a function from a Client Script?
3. Use Case to use existing function in Client Script
4. Solution
5. Timeouts in Client Script
6. How to handle timeouts in a Client Script?
7. Timeout Scenario
8. Solution
9. Summary

1. What are Functions in Zoho CRM?

Functions in Zoho CRM follows the Serverless Computing architecture. It follows cloud computing execution model in which the cloud provider dynamically manages the allocation of machine resources. Zoho CRM provides options for the customer to write their own functions using Deluge script and run their code ( proprietary within Zoho CRM ) without worrying about deploying their code in servers. Click here to know more about Functions.

2. How to Invoke a Function from Client Script?

You can invoke a function from a Client Script using the execute() method. Here is the syntax of execute() method. The Client Script execution will only proceed after the Function has completed, demonstrating synchronous behavior.

3. Use Case to use existing function in Client Script

Zylker, a manufacturing organization, utilizes Zoho CRM. Within their CRM, there is an existing function sendmailToContactRoles that allows meeting invites to be sent to all contact roles associated with a Deal at the click of a button. Deals often require inputs and approval from various stakeholders. By inviting all contact roles, Zylker ensures that all necessary parties are involved in the decision-making process, reducing delays and improving the chances of closing the deal successfully. To avoid accidental clicks,

The admin wants a confirmation message to appear when the Mail icon is clicked, asking for approval and trigger the Function based on user selection.
Additionally, the admin would like to display a success notification , if the emails are sent successfully.
Also, once the email is dispatched, a tooltip saying "Invite Sent" should be added should be added to the Mail icon.

4. Solution

Create a Client Script to accomplish the above requirements. Click here to know how to create a Client Script.
Create a Client Script for "Deals" module with onClick Event and Icon Event Type for the Detail Page(Canvas).

Enter the following code and click Save.

var isProceed = ZDK.Client.showConfirmation('Do you want to invite the Contacts of the Deals', 'Proceed', 'Cancel');
var elem = ZDK.UI.getElementByID('icon');
//If user clicks Proceed button
var deal_rec = $Page.record_id;
if (isProceed) {
ZDK.Apps.CRM.Functions.execute("sendmailToContactRoles", deal_rec);
ZDK.Client.showMessage(" All the Contacts have been invited successfully");
elem.addToolTip({ text: 'Invite Sent' });
}
else {
elem.addToolTip({ text: 'Click to send invite' });
}

After getting user's confirmation with showConfirmation() , the execute() method triggers the function.
The parameters of execute() are function name and parameters.
The name of the existing function is "sendmailToContactRoles".
The parameters of the function are record ID of the Deal and subject of the email.
$Page is a constant supported by Client Script, using which you can get information about the current record.
$Page.record_id will give the id of the current record.
Once the function gets executed successfully, you can display the success message using showMessage() . To know more about displaying messages using Client Script , check our Kaizen post Creating Alerts and messages using Client Script.
Here is how the Client Script works.

Here is the Function code where emailSubject and deal ID are the arguments of this function.

relatedcontrole = zoho.crm.getRelatedRecords("Contact_Roles","Deals",input.dealId.toLong());
emailSubject="Meeting Invite";
emailContent = " Click the following link to join the meeting this evening at 5.00 pm" + " https://meeting.zoho.com/meeting/presenter.do?key=1069852805&cid=5668066&x-meeting-org=53296550";
salutation = "Hello!! ";
signature = " Best Regards, Patricia Boyle";
sub = input.emailSubject.toString();
str = input.emailContent.toString();
str = concat(salutation,str);
str = concat(str,signature);
for each role in relatedcontroles
{
emailAddress = role.get("Email");
info emailAddress;
sendmail
[
from :zoho.adminuserid
to :emailAddress
subject :sub
message :str
content type :HTML
]
}

You can achieve the functionality of sending emails in Functions using Client Script itself using fetchRelatedRecords() and openMailer(). Here, we have made use of the existing Function.

You can use Functions in Client Script,

To leverage existing Functions for similar functionality, thereby enhancing reusability and to trigger Functions based on UI events such as Icon Event, onType Field Event, Canvas Text Event, and others, beyond the buttons and workflows already supported by Functions.

5. Timeouts in Client Script

In Client Script, executions are bounded by a 10-second time out. During execution of API calls or during the execution of a function which involves API calls , it might take more than 10 seconds to provide response. Consequently, when they are used in Client Script, execution will get halted. To overcome such scenarios you need to use Loaders.

6. How to handle timeouts in a Client Script?

Client Script allows you to manage the timeout by using a loader. The execution of Client Script will be on hold, as long as the loader is active, and so the timeout will not occur.

a. showLoader()

Use showLoader() to display the loader.

b. hideLoader()

Use hideLoader() to make the loader inactive.

7. Timeout Scenario :

At Zylker, which uses Zoho CRM, there is an existing function named "Books_send_quote" in their Zoho CRM account. The admin wants this function to execute via a Client Script whenever the status is updated to delivered and display a message saying, "Quote has been sent successfully." The admin added the script to show a success message after the function execution.

Problem :

During execution of the following code, the admin noticed that the code following the function invocation is not running. Similar problem is described in this post.

The current code is

if (value == Delivered) {
ZDK.Apps.CRM.Functions.execute("Send_Quote");
ZDK.Client.showMessage('Quotation sent successfully', { type: 'success' });
}

In such scenarios, the Messages Pane of Client Script IDE will show Timeout as shown below.

Solution:

Since the timeout limit of 10 seconds has reached, further execution did not occur. So you need to add ZDK.Client.showLoader() before the execution of the Function and ZDK.Client.hideLoader() after the function execution.

if (value == 'Delivered') {
ZDK.Client.showLoader({type:'page', template:'spinner', message:'Sending Quotation...' });
ZDK.Apps.CRM.Functions.execute("Send_Quote");
ZDK.Client.hideLoader();
ZDK.Client.showMessage('Quotation sent successfully', { type: 'success' });
}

Here is how the Client Script works.

The presence of loader on the screen will inform the user about the ongoing processes in the background.

6. Summary :

This post includes the following,

When and how to use Functions in Client Script?
How to trigger Client Script using icons?
How to add tooltip to an icon using Client Script?
How to execute Client Script based on Confirmation box?
How to display messages and confirmation box using Client Script?
How to add loaders on UI using Client Script?

7. Related Links :

Previous Post: Kaizen #138 - How are Widgets used inZoho CRM Settings? | Kaizen Collection: Home

Join us for our upcoming Zoho CRM Developer Series: Zoho CRM APIs, where you can explore more about Zoho CRM APIs. Register Now!

Zoho Desk Resources

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

Topic Participants
Maadhari M
Vigneshwaran K

Sticky Posts
Client Script | Update - Introducing Commands in Client Script!
Have you ever wished you could trigger Client Script from contexts other than just the supported pages and events? Have you ever wanted to leverage the advantage of Client Script at your finger tip? Discover the power of Client Script - Commands! Commands
Kaizen #165 : How to call Zoho CRM APIs using Client Script
Welcome back to another exciting Client Script post! In this post, we will discuss one of the most frequently asked questions: How do you call Zoho CRM APIs from Client Scripts? In this kaizen post, 1. Ways to make calls to Zoho CRM APIs using Client
Kaizen#162 : Add Tags and Open Pre-filled Email Drafts via Client Scripts
Hello everyone! Welcome to another informative Kaizen post. In this post, let us see how to accomplish the following using Client Script. 1. How to auto-tag a record based on field update? 2. How to Open a pre-filled email draft This post will provide
Extension Pointers - JS SDK series #4: Managing data from a widget using ZOHO.CRM.HTTP
Handling and managing the data between two applications is a major factor for an efficient business. There are a variety of ways to handle data between Zoho CRM and other third-party applications. You can use deluge CRM tasks, create connectors, use API
Kaizen #152 - Client Script Support for the new Canvas Record Forms
Hello everyone! Have you ever wanted to trigger actions on click of a canvas button, icon, or text mandatory forms in Create/Edit and Clone Pages? Have you ever wanted to control how elements behave on the new Canvas Record Forms? This can be achieved