Kaizen #59 - Creating alerts and custom messages using Client Script
Hello everyone!
We are happy to resume our Zoho CRM Developer Community series - The Kaizen series!
Welcome back to the new start of Kaizen!
This post is about
Client Script and its simple use cases involving ZDK Client functions.
What is Client Script?
The
Client Script feature
gives you a seamless platform for achieving and extending your business cases in Zoho CRM by allowing Java Script code execution in your browser. It enables you to configure events for the UI components and define the actions once those events are triggered.
ZDK Client Function | Description |
showMessage | To display a text message on create/clone/edit/detail(canvas) page. |
showConfirmation | To display a confirmation box with accept and reject message on create/clone/edit/detail(canvas) page. |
showAlert | To show alert message on create/clone/edit/detail(canvas) page. |
openMailer | To open mailer component from detail(canvas) page. |
Use Case
Let us consider that you want to achieve the following using Client Script.
- Calculate age based on Date of Birth and display the message "Age is more than 80" whenever the age is above 80 in create page of Policyholder module.
- Show the alert message "You cannot change the Rating of a verified account" whenever you try to update the field Rating in Accounts module.
- When you click the mail button on detail(canvas) page, ask for confirmation and open a mailer window.
Solution using Client Script
Note:
The solution listed in this post includes detail(canvas) page and create page.
To create a canvas page,
- Go to Setup > Customization > Canvas
- Click Create Record Detail Page.
- On the Create a Custom Record pop up that appears, select the module as "Accounts" and select the required layout for the canvas page
- Choose a template from the gallery and click Select.
- Enter a name and save the canvas page.
- Click Canvas Assignment and assign the page to the required profiles.
- Click here for more details on creating a canvas page(Customizing the record detail page).
1. Calculate age based on Date of Birth and display the message "Age is more than 80" whenever the age is above 80 in create page of Policyholder module
- Go to Setup > Developer Space > Client Script. Click +New Script.
- Specify the details to create a script and click Next.
- Enter the following script in the Client Script IDE and click save.
- function getAge(dateString)
- {
- var today = new Date();
- var birthDate = new Date(dateString);
- var age = today.getFullYear() - birthDate.getFullYear();
- var m = today.getMonth() - birthDate.getMonth();
- if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate()))
- {
- age--;
- }
- return age;
- }
- let age = getAge(value);
- var age_field = ZDK.Page.getField("Age");
- var category_field = await ZDK.Page.getField("Category");
- age_field.setValue(age);
- if (age > 80) {
- ZDK.Client.showMessage('Age is more than 80', { type: 'info' });
- }
- You can see the code working from the create page. You can also see how the client script works using the Run component of the Client Script IDE.
- You can use any of the following types in showMessage() function
Possible 'type'
| Script |
info | ZDK.Client.showMessage('message', { type: 'info' });
|
warning | ZDK.Client.showMessage('message', { type: warning });
|
error | ZDK.Client.showMessage('message', { type: error });
|
success | ZDK.Client.showMessage('message', { type: success }); |
2. Show the alert message whenever you try to update the field Rating
- Go to Setup > Developer Space > Client Script. Click +New Script.
- Specify the details to create a script and click Next.
- ZDK.Client.showAlert('You cannot change the Rating after account creation');
- Here is how the Client Script works. You can also see how the client script works using the Run component of the Client Script IDE.
3. Configure the mailer box with the click of a button
First of all, you need to add the button to the detail(canvas) page.
- Go to Setup > Customization > Canvas.
- Right click on the Canvas page for Accounts module and click Edit.
- Click Elements, drag and drop the button wherever required and specify a label for the button.
- Right click on the button, select Add Element ID and enter the ID of the button in the pop up that appears.
- Once the button is created, you can configure Client Script in two ways:
- Right click on the button--> Add Client Script-->onClick. The Client Script IDE appears with the event type as Canvas Button Event.
(or)
- Go to Setup > Developer Space > Client Script. Click +New Script.
- Specify the details to create a script and click Next.
- Enter the following script and click save.
- var isProceed = ZDK.Client.showConfirmation('Do you want to open the mailer window?','Proceed','Cancel');
- //If user clicks Proceed button
- if (isProceed) {
- ZDK.Client.openMailer({ from: '', to: [{ email: '', label: 'ABC Industries' }], cc: [{ email: '', label: 'ABC Industries' }], subject: 'Greetings from ABC Industries!', body: ' ' });
- }
- The showConfirmation() function will return a boolean value based on the user selection. You should capture this boolean value using a variable and write the actions based on the boolean value returned. Here the variable isProceed will capture the user response and based on that boolean value, the mailer box will get displayed.
- Here is how the client Script works,
We hope you found this post useful. We will meet you next week with another interesting topic!
If you have any questions let us know in the comment section.
Cheers!
Click here for more details on Client Script in Zoho CRM.
Related Links
Access your files securely from anywhere
Zoho Developer Community
Deliver unforgettable customer experiences
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
Zoho Desk Resources
-
Desk Community Learning Series
-
-
-
-
-
-
-
-
-
Zoho TeamInbox Resources
Zoho DataPrep Resources
Zoho CRM Plus Resources
Zoho Books Resources
Zoho Subscriptions Resources
Zoho Projects Resources
Zoho Sprints Resources
Qntrl Resources
Zoho Creator Resources
Zoho Campaigns Resources
Zoho CRM Resources
Zoho Show Resources
Writer Get Started. Write Away!
Writer is a powerful online word processor, designed for collaborative work.