Kaizen #70 - Client Script Support for Wizards
Hello everyone!
Welcome back to another interesting Kaizen post. In this post, we can discuss the recently added Client Script Support for Wizards.
What is a Wizard?
A Wizard in Zoho CRM helps you divide a long form into a series of screens. You can also have dynamic changes to your forms based on the input in Wizard using Conditional Rules in Wizard. This type of step-wise approach reduces the chances of erroneous data entry, as the partially completed form can be saved as a draft and submitted later.
What is Client Script?
Client Script gives you a seamless platform for achieving and extending your business cases in Zoho CRM by allowing Java Script code execution in your browser. To know more about the feautres of Client Script, click here.
Need for Client Script in Wizards
Client Script support for Wizard enables you to customize and extend your business cases with respect to Wizards, beyond Conditional Rules.
For example,
- Auto-populate field data while creating or editing a record using Wizard.
- Apply advanced formula computation to the fields in a Wizard.
- Achieve field validation, auto-correction, and data enrichment in Wizard.
- Display custom error messages for a specific set of users or fields in a Wizard.
Events for Wizards in Client Script
You can trigger a Client Script using the Events available for create/edit pages of Wizard.
- whenever a wizard loads - onLoad Wizard Event
- when you click on the save button in a Wizard - onBeforeSave Wizard Event
- when you navigate from one screen to another - onTransition Wizard Event
- before navigating from one screen to another screen - onBeforeTransition Wizard Event
- when you update any of the fields - onChange Wizard Event
- when you update a specific field - onChange Field Event.
ZDK Client Function | Description |
setVisibility() | Show or Hide a button or text component of a Wizard |
setContent(value) | Set text content for the text element. |
getElementByID(element_id) | Get the UIElement object. |
transitionTo(api_name) | Makes the transition to the specified screen |
getComponent(record-create-wizard) | To fetch the component details like screen information of a Wizard. record-create-wizard - is the default value of the Wizard component name. |
Note
Apart from these functions, you can use all the other ZDK functions which are not tagged as canvas.
Use Case
Med-X is a Health Care Company that uses Zoho CRM. For order creation, let us consider that there is an existing Wizard with three screens. The first screen has the product details, the second screen consists of fields related to payment using credit/debit card and the third screen consists of the address fields. The company wants to achieve the following validations and requirements using Client Script in both create and edit pages of the Wizard in Orders module.
1. The minimum quantity for the Category - Masks is 1000. If the user enters a lesser value, display the error message " Minimum quantity should be 1000". The minimum quantity for the Category Surgical Instruments is 100. If the user enters a lesser value, display the error message " Minimum quantity should be 100".
2. If the field Is shipping address same as billing address? is true , then copy and populate the Shipping Address value in the field Billing Address.
3. If the payment method in screen 1 is selected as Credit/Debit card in screen 3, then the Wizard should transit to screen 2.
4. If the country selected in the field Select the Country is India then display the below text,
Your order will be shipped using the FedEx courier service. Track your order using the link https://www.fedex.com/en-us/home.html.
If the country selected is the US, then display the below message,
Your order will be shipped using the Blue Dart courier service. Track your order using this link https://www.bluedart.com/tracking.
Solution using Client Script
The requirements are for create and edit pages of the Orders Wizard. So create two scripts as follows.
- Client Script for Create Page (Wizard)
- Client Script for Edit Page (Wizard)
1. Client script for Create Page (Wizard)
- Go to Setup > Developer Space > Client Script. Click +New Script.
- Specify the details to create a script and click Next.
- The Client Script should run as and when the fields are updated with values. So create a Client Script with Wizard Event Type and onChange Event.
- Enter the following script and click Save.
switch (field_name) { case 'Quantity': var qty = ZDK.Page.getField("Quantity"); if ((ZDK.Page.getField("Choose_the_category").getValue() == "Surgical Instruments") && (qty.getValue() < 100)) { qty.showError("Minimum order quanity should be 100 pieces"); } else if ((ZDK.Page.getField("Choose_the_category").getValue() == "Masks") && (qty.getValue() < 1000)){ qty.showError("Minimum order quanity should be 1000 pieces"); } break; case 'Is_the_shipping_address_same_as_thbilling_address': var billAdd = ZDK.Page.getField("Billing_Address"); var shipAdd = ZDK.Page.getField("Shipping_Address"); shipAdd.setValue(billAdd.getValue()); break; case 'Payment_Method': var payment = ZDK.Page.getField("Payment_Method"); if (payment.getValue() != "COD") { log(ZDK.Page.getComponent('record-create-wizard')); ZDK.Page.getComponent("record-create-wizard").transitionTo("Screen_2"); break; } case 'Select_the_Country': var Text1 = ZDK.UI.getElementByID('Text_1'); if (ZDK.Page.getField("Select_the_Country").getValue() == 'India') { Text1.setContent("Your order will be shipped using Blue Dart courier service. Track your orders using this link."); } else if (ZDK.Page.getField("Select_the_Country").getValue() == 'US') { Text1.setContent("Your order will be shipped using FedEx courier service. Track your orders using this link"); } break; } |
- Here, the field name is the event argument that will hold the value of the field that is being changed by the user in the Wizard. With the help of this argument (field_name), you can check which field is being updated by the user using switch...case or if.. else statement. To display the error message, you can use showError(error), to change the content in the text component use setContent(), to jump to a different screen use ZDK.Page.getComponent("record-create-wizard").transitionTo("Screen_X"); and to copy the content to another field use setValue(). Here, the name record-create-wizard is constant for create and edit Wizard pages.
- Here is how the Client Script works in a Wizard,
2. Client Script for Edit Page (Wizard)
To achieve the solution for the edit page of Orders Wizard, you need to create another Client Script and select the Page as Edit Page (Wizard) as shown below.
- Use the same code and click Save.
Note
Using transitionTo(api_name), you can transit only to previous screens in Create Page (Wizard).
We hope you found this post useful. We will meet you next week with another interesting topic! Get in touch with us at support@zohocrm.com if you have any questions, or let us know in the comments.
Cheers!
Access your files securely from anywhere
New to Zoho Recruit?
Zoho Developer Community
New to Zoho LandingPage?
Zoho LandingPage Resources
New to Zoho Survey?
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
New to Bigin?
Topic Participants
Maadhari M
Cameron McEvenue
Ishwarya SG
Ernesto Pena
Jeganprabhu S
Sticky Posts
Kaizen #217 - Actions APIs : Tasks
Welcome to another week of Kaizen! In last week's post we discussed Email Notifications APIs which act as the link between your Workflow automations and you. We have discussed how Zylker Cloud Services uses Email Notifications API in their custom dashboard.Kaizen #216 - Actions APIs : Email Notifications
Welcome to another week of Kaizen! For the last three weeks, we have been discussing Zylker's workflows. We successfully updated a dormant workflow, built a new one from the ground up and more. But our work is not finished—these automated processes areKaizen #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 achievedKaizen #142: How to Navigate to Another Page in Zoho CRM using Client Script
Hello everyone! Welcome back to another exciting Kaizen post. In this post, let us see how you can you navigate to different Pages using Client Script. In this Kaizen post, Need to Navigate to different Pages Client Script ZDKs related to navigation A.Kaizen #210 - Answering your Questions | Event Management System using ZDK CLI
Hello Everyone, Welcome back to yet another post in the Kaizen Series! As you already may know, for the Kaizen #200 milestone, we asked for your feedback and many of you suggested topics for us to discuss. We have been writing on these topics over the
New to Zoho TeamInbox?
Zoho TeamInbox Resources
Zoho CRM Plus Resources
Zoho Books Resources
Zoho Subscriptions Resources
Zoho Projects Resources
Zoho Sprints Resources
Qntrl Resources
Zoho Creator Resources
Zoho CRM Resources
Design. Discuss. Deliver.
Zoho Show Resources
Get Started. Write Away!
Writer is a powerful online word processor, designed for collaborative work.
Zoho CRM コンテンツ
-
オンラインヘルプ
-
Webセミナー
-
機能活用動画
-
よくある質問
-
Ebook
-
-
Zoho Campaigns
- Zoho サービスのWebセミナー
その他のサービス コンテンツ
Nederlandse Hulpbronnen
ご検討中の方
Recent Topics
Extract Archived Projects using Zoho Projects API
In my organization we archive the projects when they are already completed, charged, invoiced, so that only those that are still pending process remain active. I need to access all projects (active and archived) from an external system, but the API v3Ask the Experts: Five-hour live Q&A session with Zoho WorkDrive product experts
Have questions about WorkDrive 5.0? Let’s talk! We recently launched Zoho WorkDrive 5.0, packed with powerful updates to help your team work smarter, stay secure, and get more value from your business content. From content-centric workflows and AI-poweredFile upload support for subforms
Dear All, Subforms help you add and track data related to your CRM records. We've always supported most of the commonly used field types in subforms, so as to cater to your business requirements. Now we're happy to extend support to file upload fields.Circular record relationship in CRM
Given there is a lookup in custom module Transactions creating a related list on the chosen Contact record. I. e. a lookup field on Transactions module points to Contacts. The related list on a Contact record can thus have have many transaction records.Is it possible to pull the Zoho desk data into Zoho analytics in real time
Hi - I am looking to add more dashboards and reports of Zoho Desk in analytics. I see there is a schedule to pull the data into analytics, but I'm wondering if there is an option to pull the data in real time instead of a specific interval?Enhance productivity with the revamped Zoho Sheet View
Hello folks, For some time now, you've been able to use the Zoho Sheet View to quickly edit multiple records or to insert a batch of new records. Its tabular interface allows users to engage in these tasks productively. Despite this, the existing SheetHow to set value of dropdown field to variable
For the life of me, I can't figure out why the following code won't set input.status to the previousSelection. Steps to reproduce: 1. Click input.complete 2. input.status dropdown updates from '1-Backlog' to '4-Done' 3. Click input.complete again to deselect[Product Update] TimeSheets module is now renamed as Time Logs in Zoho Projects.
Dear Zoho Analytics customers, As part of the ongoing enhancements in Zoho Projects, the Timesheets module has been renamed to Time Logs. However, the module name will continue to be displayed as Timesheets in Zoho Analytics until the relevant APIs are[WEBINAR][MEA] Learn how to control your inventory and multi-channel sales with the Zoho Inventory & Zoho Books integration
Hello there, We are hosting an exclusive live webinar tailored for businesses across the Middle East and African countries, where you'll learn how to take full control of your inventory and multi-channel sales while keeping your accounting perfectly inLess clicks, more connection – the usability edge of Zoho Desk
Imagine joining a new workplace, eager to prove your skills, partner with peers, learn new tools, and build a strong foundation for your career. The standards you've set could drive pressure into your head. You now discover the organization is using ZohoTip #3 Automating total item weight calculation for your sales orders in Zoho Inventory
Hello, Hope the day is treating you well. Last week, we saw how we could automate the calculation of total shipping charges from numerous shipments for your sales orders and invoices. This week, we will see how you can automate the calculation of total item weight for your sales orders. How does this work? First, you are required to capture the weight of all your items using a custom field. And when you create a sales order, you can either have the system display the individual weights for you orWhy Format section gets disabled when we create Merge Template over PDF
I need some assistance I have a Client who is going to give certificates to users who passes his exam. So, I am using mail merge but in ZOHO writer after I upload the PDF and create merge Template over PDF the format Section gets disabled. My problemWhatsapp Integration on Zoho Campaign
Team: Can the messages from Zoho Campaign delivered through Whatsapp... now customers no longer are active on email, but the entire campaign module is email based.... when will it be available on whatsapp.... are there any thirdparty providers who canHow to calculate separate totals for Product Line Items filtered by category in Quotes?
Hello! I'm working with Quotes in Zoho CRM and need help calculating conditional totals for line items. Current setup: I have two tables in my Quote template (Zoho Writer), both displaying Quoted Line Items Table 1 (top): Shows all products where ProductI Need Help Verifying Ownership of My Zoho Help Desk on Google Search Console
I added my Zoho desk portal to Google Search Console, but since i do not have access to the html code of my theme, i could not verify ownership of my portal on Google search console. I want you to help me place the html code given to me from Google searchZoho Desk API Documentation missing a required field
We are trying to create a section using this information. Even after preparing everything based on that page, we still get an error. The error we get is this: {"errorCode":"INVALID_DATA","message":"The data is invalid due to validation restrictions","errors":[{"fieldName":"/translations","errorType":"missing","errorMessage":""}]}Fetch Subform values through a lookup of a lookup
Hi, I'm having an issue fetching the values of a subform through a lookup field through another lookup field. The code works perfectly to show me the subform row ID, but the second I try to get any readable data, it says "Error occurred. Please contactTurn Decision Box to a button
Dear all, I need your help on CSS to turn a Decision Box to a Button. I have a Decision Box like: Turn on/off to refresh the information. (on User Input, either True or False, will refresh the information) Now I want to simulate to treat it like a RefreshEmails not being received from a particular domain
Cannot receive any emails sent from atco.com Domain is in the spam whitelist so should be no reason for it not to be coming through. Have filed a ticket and besides a generic response of we are looking at it - it seems there is no actual support workersStock Count
The stock count is a nice new feature, but we cannot figure out how to: 1. Use it without assigning to a person, we have a team or one of multiple do stock counts as do most any company. 2. Add any extra fields to what the "counter" sees. The most importantCan you import projects into Zoho Projects yet?
I see some very old posts asking about importing project records into Zoho Projects. But I can't find anything up to date about the topic. Has this functionality been added? Importing tasks is helpful. But we do have a project where importing projectsHow to delete attachments form Zoho mail accounts
I can't find a way to delete attachments from Zoho mail messages, either individually or in bulk. Searches here are providing conflicting results and often talk about workspace, whereas I am only interested in how to delete attachments that are seen withSend Whatsapp message from Whatsapp template with custom variables
Hi, I'm trying to do some basic integration for sending WhatsApp messages from Zoho CRM using Zoho Desk whatsapp templates. When creating new whatsapp template in Zoho Desk we can choose ticket related fields as variables but it's not clear how to useOutgoing blocked: Unusual activity detected.
I just made payment for my Zohomail Today and have been debited so i will like to be Unblocked because this is what it says (Outgoing blocked: Unusual activity detected) Thank you i await your swift responsesIntegrating with My Own Application and ZOHO CRM Simultaneously
I have my own WhatsApp bot that uses my WhatsApp business account. I want to use the same phone number to integrate with ZOHO as well. What is the recommended way to do that? Should I integrate my application with ZOHO, forwarding messages whenever theHow do i move multiple tickets to a different department?
Hello, i have several tickets that have been assigned to the wrong department. I am talking about hundreds of automatically generated ones that come from a separate system. How can i select them all at once to move them to another department in one go? I can select them in "unsassigned open tickets view" but i can't find a "move to another department" option. I also can't seem to assign multiple tickets to the same agent in that same view. Could somebody advice?Account for Cryptocurrency Holdings in Zoho Books/Custom Currencies?
Hello, I've recently started using Zoho to run my small business and I've really been enjoying all of its features. However, I've been struggling to find a way to account for cryptocurrencies in Zoho Books. My company mines a Cryptocurrency token calledTransferring CRM Attachments to Workdrive
relatedrecords = zoho.crm.getRelatedRecords("Attachments","Conditions",conId); attachid = List(); for each ele in relatedrecords { attachementId = ele.get("id"); attachid.add(attachementId); } for each ele in attachid { counter = 1; downloadFile = invokeurl [ url: "https://www.zohoapis.com/crm/v2/Conditions/" + conId + "/Attachments/" + ele type: GET connection : "work_drive" ]; resp2 = zoho.crm.attachFile("Deals",dealId,downloadFile); resp3 = zoho.workdrive.uploadFile(downloadFile, dealWD, "PlaceHolder"+counter+"",Payment system for donations management
I manage an organization where we receive donations from payers. Hence, there is no need to first create invoices and then create payments received against the invoices. What are the recommended best practices to do this in ZohoBooks?New Customization options in the module builder: Quick Create and Detail view
Hello everyone, We have introduced two new components to the module builder: Quick create and Detail view. The Quick Create Component It is a mini form used to create a record and associate it to the parent record from a lookup field. For example, if you have a Deals lookup in the Contacts module, then you can associate existing deals or create a deal and associate it with the contact. You can customize this Quick Create form by adding standard as well as custom fields. There is no limit to the numberunblock my zoho mail account. outlines@zoho.com
please unblock my zoho mail account, outlines@zoho.comSMTP email sending problem
Hello, I've sent emails before, but you haven't responded. Please respond. My work is being disrupted. I can't send emails via SMTP. Initially, there were no problems, but now I'm constantly receiving 550 bounce errors. I can't use the service I paidMailk got blocked / Inquiry About Email Sending Limits and Upgrade Options
Dear Zoho Support Team, My name is Kamr Elsayed I created this account to use for applying for vocational training in Germany. As part of this process, I send multiple emails to different companies. However, after sending only 8 emails today, I receivedForwarder
Hi, I tried to add a forwarder from which emails are sent to my main zoho account email . However, it asks me for a code that should be received at the forwarder email, which is still not activated to send to my zoho emial account. So how can I get theNo chat option
Chat option is not supported.Direct “Add to Google Calendar” Option in Zoho Meeting
Hello Zoho Meeting Team, Hope you are doing well. We would like to request an enhancement related to the “Add to Calendar” functionality in Zoho Meeting. Currently, when we open Zoho Meeting and view our meetings under My Calendar, there is an Add toDefault Tagging on API-generated Transactions
If one assigns tags to an Item or Customer, those tags get auto-populated in each line item of an Invoice or Sales Order when one creates those documents. However, if one creates the Sales Order or Invoice via the API (either directly coding or usingDKIM cannot be enabled for the domain as no verified default selector present
Hi Support Team, For Domain DKIM record trying to enable status. but showing error "DKIM cannot be enabled for the domain as no verified default selector present" So, please resolve the issue. Thank you.unable to send message reason 554 5.1.8 Email outgoing blocked
unable to send message reason 554 5.1.8 Email outgoing blockedI can't log in to my account on Thunderbird
I've just had to rebuild my PC (calamitous mess from Microsoft with Win10/Win 11 'upgrade' - they confirmed I had to start with a new build). I have used Zoho mail for years via Mozilla Thunderbird, but now I've had to download the latest version of TBird,Next Page