Client Script | Update #5 - Supporting Dynamic Lookup Filters, Flyouts, Widgets, List & Detail Page (Standard) and much more!

Hello everyone!

We are immensely delighted to introduce the most-anticipated and enchanting features on Client Script to empower you to fulfill sophisticated functionalities in Zoho CRM, thereby providing a rich experience to your users.

Let us walk through this post with a real time scenario that happens day-to-day in a Manufacturing Industry - Zylker, which manufactures Medical Instruments. Their service agent uses the Orders module of their Zoho CRM to create and manage orders for their customer.

Zylker started using Client Script to implement a process to automate repetitive steps, whenever a new order is created. They maintain their customer contact information in CRM and their shipment information separately in a third party service. They wanted the shipment address details to be fetched and auto-populated based on the value of the field Customer Name.

However, their requirement did not end there. Now, they want more sophistication for a seamless and facile business flow.

Business Case #1 : Pseudo fields

Zylker wants the field Shipment Label to get pre-constructed by combining the values of three inputs, viz. Order Label, Unit, and Batch. However, this should not include the creation of additional custom fields for getting these three inputs.

Introducing getInput() in Client Script!

You can now create pseudo fields in the UI and use them inside Client Script. i.e. Basically like a quick form on demand.

view code

Business Case #2 : Order Guide

The company has multiple warehouses located in different locations. Each warehouse uses different shipment carriers with different charges and timelines for delivery. They want to help the service agent by providing an Intuitive User Interface with necessary information during order creation based on the shipping address.

Introducing Flyouts in Client Script!

Flyouts are floating User Interface that can be spawned and controlled using Client Script. Presently, Widgets can be used to render a flyout. The flyout can run independently and any Client Script can communicate with it. Also, it can be made to wait for user input and transport back the data to the Client Script.

view code

Note: The pseudo fields can be created and used only in Client Script.

Business Case #3 : Contextual record filter in lookup

Zylker wants to list the available instruments in the lookup field "Instrument Name" based on the type of Instrument that a service agent selects in the field "Type". For example, if the service agent selects the Type as "Surgical Instruments", then he should be allowed to choose only instruments of such type in the subform.

Introducing the most - expected Dynamic lookup filters in Client Script!

Dynamic Lookup filters in Client Script enable you to filter the results of a lookup field based on some criteria. Not by just using the field value on that page, You can also filter the results of the lookup with current date/time, logged-in user, or almost anything that you can handle using Client Script.

view code

That's not all.

Note: Multi-select lookup fields also get this support. You can achieve this in Create, Edit, Detail(Standard) and Clone pages.

You can also implement dynamic filters for picklists as well using Client Script.

For example, if the service agent selects the Type as "Surgical Instruments", then the warehouse picklist field will have only three options from the pool of twenty options.

Business Case #4 : Proactive handling of order creation

Zylker receives numerous orders per day. There is a high chance that the selected instrument goes out of stock. Upon clicking the Save button, the requirement is to validate the availability of the medical instrument in the selected warehouse, suggest alternative warehouses, and provide support to choose amongst the feasible warehouses.

Supporting Widgets invocation from Client Script!

Widgets in Zoho CRM are embeddable UI components that you can create on your own. Here, when the user clicks Save, the validation can be triggered using Client Script and the widget shall be displayed accordingly. The Client Script execution context will be paused and the widget will be spawned. The Widget, after completing its purpose can transport the necessary data back to the Client Script, and then the Client Script can continue its execution with the data received from the widget.

view code

List Page Support in Client Scripts

Business Case #5 : Masking and Highlighting data

Zylker allows its contractors to view the list of orders created. They want to mask the contact number of the customers present in the Orders List View. They also want to highlight the records based on some criteria.

Client Script now supports field masking and style highlights in the list view!

You can now mask fields completely or partially in the List Page (Standard) of any standard or custom module in Zoho CRM using the maskField() method in Client Script. Also, you can now highlight the records, columns or fields with different colors and change the text color based on the given criteria.

Business Case #6 : Notification alert for orders overdue

When visiting the Orders List Page, Zylker wants its managers to be alerted whenever there are orders awaiting approval and overdue and provide an option to approve them instantly.

onCustomViewLoad event support for List Page

You can now configure a Client Script to be executed when a custom view gets loaded.

Markdown Support in Alerts and Confirmation Box

You can now display alerts and confirmation box with customized text and highlights using markdowns.

view code

That is not all!

Detail Page (Standard) Support in Client Scripts

We are ecstatic to let you know that the wait is over. Yes! Client Script now supports Detail Page (Standard) as well. You can now use Client Scripts to customize the Detail Page (Standard) with the following events.

Page Event
Field Event
Blueprint Event
Mandatory Fields Form Event
Tag Event

Field locking support - Make fields read-only in Detail Page (Standard)

You can now make fields read-only based on any condition using Client Script in Detail Page (Standard). For instance, Whenever you want to stop users from editing the values of the fields Category and Product in the Detail Page (Standard), you can accomplish this using setReadOnly().

view code

Hide/Show fields using Client Script

Have you ever wanted to hide fields based on a specific condition? Well, here is the solution! Fields can now be hidden using Client Script.

For example, if you want to hide the Annual Revenue field of the Accounts module for records having Account Type as Supplier and show the Annual Revenue field for other Account Types, you can use setVisibility().

view code

Note: You can hide fields in Create, Edit, and Clone pages also.

Component support for List Page (Standard)

getComponent(): You can get the list page components by name.
setValue(): You can set the component value on the list page. For instance, you can change the custom view to be rendered on demand.
getValue(): Allows the user to get the component value on the Page.
getOptions(): Get options available for the specified list page component in a list page.
setOptions(): Allows the user to set options on a component page.

Other enhancements being offered in Client Script

openURL(): You can open the given URL in a tab or window.

refresh(): You can now perform a soft reload via Client Script for Detail Page (Canvas).

addInfo(): You can now add information for a particular field.

addTooltip(): You can now add additional tooltips while hovering on fields.

getPicklistOptions(): This allows you to get the picklist options as an array.

We hope you would get benefitted immensely. You need not wait longer.

P.S. We will be rolling the above features soon.

Happy coding!

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

Tout forum

France ZUGs

Zoho SalesIQ Resources

Sticky Posts
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
Extension pointers - Simple yet significant pointers #11: Testing an extension in sandbox
After developing an extension using the Zoho developer platform, developers will want to test it before publishing it and making it available to end-users/customers. The Zoho developer platform includes a sandbox testing environment, which is a simulated