Guide: Learn How to Deploy Client Script across Zoho CRM and Best Practices to Optimizing Code
In this article, we will explore the "Client Script" features in Zoho CRM, along with detailed guidance on how users can deploy these scripts across different places within the Zoho CRM organization.
Client Script
Client Script is a piece of JavaScript code that runs directly in your web browser instead of the server, thus returning an immediate response. In Zoho CRM, Client Scripts are executed based on predefined event triggers in the client web browser. i.e., Based on the client-specific actions (such as - onLoad of Page, onChange on Field, onClick of Button), we can trigger the Client Script and perform the specified custom actions.
For example: When a client fills an email address in 'Email' field of a Lead/Contact, we can perform an Email Discovery and automatically populate relevant information (such as - First Name, Last Name, Phone, etc.) within the same page (i.e., Create Page, Edit Page, etc.) in the respective fields.
Deploy Client Script in various places
Such as
-> On_Load/On_Save/On_Edit of Page, On_Type/On_Change of Field, Subform Events, Blueprint Events, List View Events, etc.
-> Commands/Shortcut Keys (Trigger script from anywhere & anytime in CRM).
-> Custom Button (Recent Enhancement)
-> Notes Related List within any record (Recent Enhancement)
-> On Client Portals (Recent Enhancement)
Refer to the following Help Reference to know more about Client Script Events Details.To Create Client Script:
You could add Client Script through two ways:
1. Through Setup Page:
Navigate to Setup (⚙️) in Zoho CRM >> Developer Hub >> Client Script >> New Script.
-> Provide a Name & Description appropriate to script
-> Category Details -
- Select Category based on requirement. Module - triggers via Events || Commands - triggers via Command Pallet/Shortcut Keys.
- Choose Module where you want to add script. i.e., Lead, Contact, etc.
- Choose Page to deploy script in specific page. i.e., Create, Edit, Clone, Detail, List, etc.
- Choose Layout. i.e., Standard or Custom layouts.
-> Event Details -
Select Event Type - Field Event or Page Event or Subform Event
- Field Event -> Select the Field & Event (i.e., onChange on First Name field).
- Page Event -> Select the Page & Event (i.e., onLoad on Create Page).
- Subform Event -> Select the Subform & Event (i.e., onCellChange).
2. Through Detail/List/Create/Edit/Clone Pages of a Record in Module
-> Choose a desired module in Zoho CRM, and open either the List, Create, Detail, Edit or Clone page of any record in that module. For example, consider the Create Lead page.
-> For Pages (such as Create/Edit/Clone) - In the right-most corner of the page, click Client Script. Then, Add script.
-> The Category details will be pre-populated by the system. Fill in the other details of the client script, such as Name, Description, Event Details of the client script. Further, click next and add your script to the code editor in Client Script IDE. Then click Save and Close.
Add Client Script via Detail Page:
Add Client Script via Different Pages such as List/Create/Edit/Clone:
TIPS: How to Optimize the Code in Client Script
It is essential to write code in an optimized way to ensure smooth execution and avoid potential errors when working with Client Scripts in Zoho CRM. This also helps to enhance performance, maintainability, reduce unwanted API calls and a well-structured code with optimal logic.
Avoid Repetitive Code
-> Client Script supports a standard sub-feature called "Static Resources". It provides an easier way to import existing code files in the form of static resources and use them in your script. You could upload a Javascript file as a static resource, include the uploaded file in your script using the Add button on the right panel of the Code Editor, and call the function in the static resource file from your script whenever it is required. Refer to Static Resources in Client Script for more information.
Use default ZDK Client methods and Web CRM API
-> Client Script provides ZDK (i.e., Zoho Developement Kit) libraries with various default built-in methods, which help users to make the business process in more efficient way within Zoho CRM. Using these readily available methods, we can perform default actions such as showing pop-up/alert, fetch/update record data instantly, fetch logged-in user's/Org's information, etc. Learn more about Client API with samples.
-> Similarly, we support various Web CRM methods that serve as wrappers of the Zoho CRM REST APIs, and users can use them directly within Client Script and make the necessary actions within Zoho CRM. Refer to CRM API for more information and direct samples.
Minimize Web API calls within Zoho CRM
-> Every Web API will consume an API credit, same as mentioned for Zoho CRM APIs used within Custom Function/Developer Tool/Third-party system. For example: fetchById (Web API) consumes the same credits as per 'Get Record' CRM API. Whereas, the Client API will not consume any credits, as it's a UI action on the client end. Excess API calls (or repeated API calls within Loop) may cause API usage to exceed the allowed limits.
Avoid Unnecessary Loops:
-> If you are using a for() Loop in a script, then try to filter the records before it enters into the loop. You could also add an IF condition inside the 'for() Loop' to filter records within the loop.
-> Use Bulk CRM APIs, which make bulk actions (such as bulk read or bulk write) instead of looping through individual API calls. Users can call the Zoho CRM API within their Client Script using the default Connection method.
Usage of Variables & Logging in Production
-> While writing the script, users can add log()/console.log() to each variable to check the output for seamless functionality. Users can view the output in the "Messages" tab within Client Script IDE for each logs() print. To view console logs, you could follow - "Right Click on browser page >> Inspect >> Console".
-> After the complete code testing, we would suggest to remove or comment out logs and unused variables to make the script cleaner and easier to debug in the future.
-> Ensure to use the meaningful variable names you define, which clearly reflect the data they store or the purpose they serve. This improves the readability of your script and makes debugging & collaboration significantly easier.
For example:
// ❌ Not recommended
- x = input.get("Account_Name");
- var ar = ZDK.Apps.CRM.Leads.fetchById( record_id );
// ✅ Recommended
- accountName = input.get("Account_Name");
- lead = ZDK.Apps.CRM.Leads.fetchById( record_id );
- Use Try-Catch Blocks
-> Use try-catch blocks to handle exceptions smartly without wrapping every line in a try. Log required error messages that help trace the exact problem with the line of code. Refer to the below example syntax to use Try-Catch in Client Script.
- //Below code has syntax error at line 4 while updating the field. Hence, an exception thrown via Catch.
- try {
- value = "test"
- ZOHO.CRM.FIELDS.setValue("City", value); //incorrect syntax
- }
- catch(e) {
- log("e ", e)
- log("e.message. ", e.message);
- }
Use Null Check to Prevent Errors
-> When you use the get() method in Client Script, you could include a null check to avoid any errors that say "undefined/null".
In Client Script, user can use below to check null results:
Using || operator - This helps to assign 0 if the value is null, undefined, "", or 0.
- phone = ZDK.Page.getField("Phone").getValue();
- getFieldVal = phone123 || 0;
- log(getFieldVal); //phone123 is not defined - result is "0"
Using ?? operator (recommended) - This helps to assign 0 if the value is null or undefined, but not if the field is an empty string or 0.
- emptyStr = "";
- getName = emptyStr ?? 0;
- log(getName); //no string - result is empty result instead of 0
Using if() condition - Users can also use if condition to check field value and assign 0.
- let phone = ZDK.Page.getField("Phone").getValue();
- if (phone === null || phone === undefined || phone === "") {
- phone = 0;
- }
- log(phone);
Refer to the Sample Codes to learn more about Client Script.
If you need any further clarifications, please don’t hesitate to contact partner-support@zohocorp.com.
Additionally, we kindly ask all Europe and UK Partners to reach out to partner-support@eu.zohocorp.com.
Access your files securely from anywhere
Zoho CRM Training Programs
Learn how to use the best tools for sales force automation and better customer engagement from Zoho's implementation specialists.
Zoho DataPrep Personalized Demo
If you'd like a personalized walk-through of our data preparation tool, please request a demo and we'll be happy to show you how to get the best out of Zoho DataPrep.
- Zoho Workerly Home
- Forums
- Connect With Us:
- Zoho Recruit Home
- Forums
- Connect With Us:
New to Zoho Writer?
Create. Review. Publish.
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Zoho Marketing Plus?
Everything you need to run your marketing
You are currently viewing the help pages of Qntrl’s earlier version. Click here to view our latest version—Qntrl 3.0's help articles.
New to Zoho Survey?
Zoho Sheet Resources
Zoho Forms Resources
New to Zoho Sign?
Zoho Sign Resources
Sign, Paperless!
New to Zoho TeamInbox?
Zoho TeamInbox Resources
New to Zoho ZeptoMail?
Design. Discuss. Deliver.
New to Zoho Workerly?
New to Zoho Recruit?
New to Zoho CRM?
New to Zoho Projects?
New to Zoho Sprints?
New to Zoho Assist?
New to Bigin?
Related Articles
Guide: Learn How to Deploy Custom Function Zoho CRM and Best Practices to Optimizing Code
In this article, we will explore the "Custom Function" features in Zoho CRM, along with detailed guidance on how users can deploy these scripts across different places within the Zoho CRM organization. Custom Function A Custom Function in Zoho CRM is ...Learn How to Open Email Composer Automatically with Template in Zoho CRM using Client Script
Requirement Overview A Zoho CRM user wants to automate and simplify the process of sending a repetitive emails to different customers based on user's specific action, instead of manual clicking on Send Email button each time. Use-case In a Product ...Client Script: Confirmation Prompt Before Deleting Critical Data in Zoho CRM
Requirement Overview A Zoho CRM user wants to have a Confirmation Alert to ensure having a double confirmation before Clearing data from the Sensitive & Critical fields. Use-case A Bank which uses Zoho CRM to manage client interaction in an effective ...Client Script: Effective way to handle Data Validation before Lead Conversion in Zoho CRM
Requirement Overview A Zoho CRM organization wants to have validation within Lead module for all Contact's mandatory fields before Lead Conversion. i.e. The Business need an easier & best way to validate lead data before Lead Conversion using default ...How to Auto Populate Product List Price in Zoho CRM Subform Using Client Script
Requirement Overview The customer wants to automatically update and display the List Price of the Product in the Subform of the custom module (i.e., Pre-Orders) based on the selected Price Book (i.e., Lookup field) stored in the same module. This ...
New to Zoho LandingPage?
Zoho LandingPage Resources