Client Script Support for List Page (Canvas)

Client Script Support for List Page (Canvas)

Hello everyone!

Welcome to another week of Kaizen. In today's post lets see how Client Script can be used in Canvas List Page to mask sensitive information from specific roles and add colors to Canvas List Page records based on custom criteria.This use case solves the question raised in this post.


In this Kaizen post,
  1. About Canvas List Page
  2. Supported Events for List Page(Canvas)
  3. Supported ZDKs for List Page(Canvas)
  4. Use Case
  5. Solution
  6. Summary
  7. Related Links

1. About Canvas List Page

The Canvas List Page provides ways to customize the record display in the module list. You can add record images, use custom buttons to represent fields, use specific font style or size for the field labels, change the alignment of field types and more. 

2. Supported Events for List Page(Canvas)

You can write Client Script for three different views of the Canvas List page.
  1. Custom List view
  2. Tile view
  3. Table view
You can trigger Client Script on your List Page (Canvas) using the following events.


Click here to know more about the Events.

3. Supported ZDKs for List Page(Canvas)

Client Script enables you  to customize List Views using the following list of ZDKs and Client Script functions.

  1. freezeColumns(option) - You can freeze list view and disable modifying columns.
  2. maskField(field_name, (length,character,reverse)) - You can mask fields in the List View
  3. sortByField(field_name, option) - You can sort field in the List View
  4. getRecords() - You can get Records in the List View
  5. selectRecords(criteria) - You can select Records in the List view by criteria
  6. selectRecordsByID(ids) - You can select Records in the List view by record ID
  7. clearSelection() - You can clear selected Records in the List view
  8. style(style_config, criteria) - You can style Records in the List View.

4. Use Case

Zylker uses Zoho CRM to manage high-volume orders where customer phone numbers are sensitive data. The CRM Admin wants role-based phone number masking on the Orders List Page (Canvas). To improve visibility and speed, the Admin also wants color-coded order cards in the List View based on order status.

Role-Based Phone Number Visibility



Order Status Color Coding




5. Solution

  1. Go to Setup > Developer Space > Client Script. Click +New Script.
  2. Specify the details to create a script and click Next.



  3. Enter the following script and click Save.

  1. // Mask phone number based on user role
  2. if ($Crm.user.role.name === "Sales Executive") {

  4.     // Mask 7 digits for Sales Executive
  5.     ZDK.Page.getList().maskField("Phone_Number", {
  6.         length: 7,
  7.         character: "#",
  8.         reverse: true
  9.     });

  11. } else if ($Crm.user.role.name === "Support Agent") {

  13.     // Mask 10 digits for Support Agent
  14.     ZDK.Page.getList().maskField("Phone_Number", {
  15.         length: 10,
  16.         character: "#",
  17.         reverse: true
  18.     });
    }

  20. // Highlight cancelled orders in light red
  21. ZDK.Page.getList().style({
  22.         record: {
  23.             backgroundColor: "#FFD6D6"
  24.         }
  25.     },
  26.     "(Status:equals:Cancelled)"
  27. );

  29. // Highlight delivered orders in light green
  30. ZDK.Page.getList().style({
  31.         record: {
  32.             backgroundColor: "#D3F9D8"
  33.         }
  34.     },
  35.     "(Status:equals:Delivered)"
  36. );
  1. Use $Crm.user.role.name to retrieve the role of the currently logged-in user.
  2. When the role is Sales Executive, use ZDK.Page.getList().maskField() on the Phone_Number field to mask the first 7 digits, where 
    1. length defines how many characters should be hidden
    2. character: '#' specifies the masking symbol
    3. reverse: false ensures masking starts from the beginning, allowing partial visibility.
  3. When the role is Support Agent, use ZDK.Page.getList().maskField() on the Phone_Number field to mask all 10 digits, fully hiding the phone number using the same masking parameters.
  4. Use ZDK.Page.getList().style() to apply conditional styling to list records by configuring the record parameter to set the row backgroundColor.
  5. Apply the condition (Status:equals:Cancelled) to highlight cancelled records in light red, and (Status:equals:Delivered) to highlight delivered records in light green, enabling quick visual identification.

  6. Here is how the Client Script works for a "Sales Executive".



  7. Here is how the Client Script works for a "Support Agent".



  8. Here is how the Client Script works for a for other roles like, Manager and Admin.



6. Summary

  1. Mask sensitive fields dynamically in List Page Canvas
  2. Apply role-based logic using current user context
  3. Improve list view readability with conditional record styling

7. Related Links

  1. List Page Canvas
  2. Client Script Overview
  3. ZDK Documentation
  4. Event dictionary
  5. Client Script related Kaizen posts








    • Sticky Posts

    • Kaizen #198: Using Client Script for Custom Validation in Blueprint

      Nearing 200th Kaizen Post – 1 More to the Big Two-Oh-Oh! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.

    • Kaizen #226: Using ZRC in Client Script

      Hello everyone! Welcome to another week of Kaizen. In today's post, lets see what is ZRC (Zoho Request Client) and how we can use ZRC methods in Client Script to get inputs from a Salesperson and update the Lead status with a single button click. In this

    • Kaizen #222 - Client Script Support for Notes Related List

      Hello everyone! Welcome to another week of Kaizen. The final Kaizen post of the year 2025 is here! With the new Client Script support for the Notes Related List, you can validate, enrich, and manage notes across modules. In this post, we’ll explore how

    • 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 are

    • Recent Topics

    • Animated GIF Images in Chat

      I know this seems to be a small feature request but in a recent Cliq update Zoho disabled autoplay for animated GIFs posted in Cliq conversations. We think this was not a good change. In our organization, animated GIFs in a chat play a role in expressing

    • I can't seem to login in to Mail Apps of MacOS /IOS

      Hi, i'm having trouble in signing in to mail apps from IOS. It's always come back to wrong passwords. But i already changed my password like 3 times. But still it says wrong credentials

    • Profile Image Showing Incorrectly in Zoho Mail

      Hi everyone, I’m facing a serious issue with Zoho Mail. The profile image showing for my email address is incorrect — it’s not my image. When I send an email to my Gmail account, it displays someone else’s image. This looks very suspicious and can make

    • I need access to my old email

      I need access to my old email bromzeman@zoho.com to verify it for forwarding. I can’t access the inbox to get the confirmation code. Please assist with recovery or forwarding. as you might already know, they made alot of the email addresses to have that

    • Set Defaults for Email Groups

      Is there a way to set defaults for all of the groups that I establish as a moderator? For example, I want every group I establish to have the following settings: 1. Moderator is <user> 2. User is <user>, <user> 3. Notifications for new group turned

    • LOGS FOR RECEIVED MAIL ( READ DATE & TIME)

      In Zoho mail we can extract the read logs of received mails so that we can see when we have read the mail and at what time & we have read it.

    • Domain verification probem

      Hello, i use a domain from Namecheap with hosting from Cinfu when i try to verify my domain on zoho i get "TXT Verification failure" i even tried the HTML verification and the code appears but also giving me the verification failure error.

    • Switching to Cloudflare email routing from Zoho Mail

      Hello, I'm currently working on migrating from Zoho Mail to Cloudflare's email routing solution. This requires changing MX and TXT records for our custom domain - when we do this, will our users still be able to log into their accounts and access an archived

    • Un Subscription Button

      How can i Add the Un Subscription Button in Zoho mail

    • Documents unable view and need to downlad

      I can't view .doc files in Zoho mail unless I download them, but I can view PDF files without downloading.

    • we encountered a problem while sending your email. please try again later.

    • Adding and removing people from groups

      We're having problems adding people to a group. Apparently Zoho has one email address and will not recognize a different email address.

    • MAIL SEARCH IS NOT WORKING

      THIS ISSUE HAS BEEN BUGGING ME SINCE MORNING, PLEASE RESOLVE THIS AT THE EARLIEST

    • URL Parameter on Help Center SIgn in link

      Is it possible to add a url parameter to the sign in link on the Help Center?

    • migrating from HelpScout

      I am attempting to import a conversation file from helpscout into desk and am receiving size errors. What is the current file size restriction. Does anyone have any tips for a successful migration?

    • Layout Rules Don't Apply To Blueprints

      Hi Zoho the conditional layout rules for fields and making fields required don't work well with with Blueprints if those same fields are called DURING a Blueprint. Example. I have field A that is used in layout rule. If value of field A is "1" it is supposed to show and make required field B. If the value to field A is "2" it is supposed to show and make required field C. Now I have a Blueprint that says when last stage moves to "Closed," during the transition, the agent must fill out field A. Now

    • Article Name Sorting in Zoho Desk Knowledge Base (agent / admin side)

      Dear Zoho Desk Support, We are writing to request an enhancement to the Knowledge Base management feature within Zoho Desk. Currently, there is no option to sort articles by their name, which significantly hinders efficient article management, especially

    • How to parse JSON data with SQL in Zoho Analytics?

      Hi all, I have a column with JSON data. I want to show this column in a chart, but it is very messy, and no JSON parsing function is supported on Zoho Analytics. data example: {"id": 5, "status": "false", "date": "15/10/22"} what I want to do in SQL is

    • Add an Equation Field (Or update the Formula Field)

      Hi, I would like to be able to have one field as a Text Field with QR Code, and then have multiple Equation/Formula Fields that then take parts of that fields data with LEFT, MID, RIGHT, REGEX, etc. Thanks Dan

    • How to parse column having JSON data using SQL?

      We have a daily sync from a PostgreSQL database that brings data into Zoho Analytics. Some of the columns store raw JSON data. We need to build SQL queries on top to parse data from JSON and store them in discrete columns. There is no option for "Data

    • Enable report button based on the current user role

      Greetings  i have a report that contains action buttons, i want these buttons to appear as enabled only when the current logged in user has a certain role, for example only CEO role users will be able to use this button. but when setting the conditions

    • 500 Internal Error In Mail API

      I'm getting 500 Internal Error when using mail API. I'm getting this error for this one account, it works fine for other Account IDs which I have in my system.

    • Zoho Sign Document upload to the Attachment section of the Zoho CRM Deals record

      Hi, Is there a script I can use to attach a document once signed in the Deals record attachment section? I know that the fiels are uploaded in the Zoho Sign Document module but our client wants it in the attachment section. They are using the "Send with

    • Zoho live chat widget in React Js

      I am trying to test Zoho live chat widget code in react js, below is the sample code void(0)} onClick={()=>window.$zoho.salesiq.floatwindow.visible("show")}>LIVE CHAT window.$zoho = window.$zoho || {};window.$zoho.salesiq = window.$zoho.salesiq

    • Are there any plans to add Triggers for Subform edits?

      By The Grace of G-D.  Hi, How are you? Can you tell me if you have any plans to support subform edit as a workflow trigger? And what about have them trigger an "onChange" client script?

    • Zoho commerce

      i am facing issue with order summary emails.i am getting 1 continuous email for order received yesterday and today.ideally 1 email should be received for a particular date ie for 02/08 i should received 1 email from 12.01am till 11.59pm but it is being

    • Feature Request: Improve Category Page Sorting for "Out of Stock" Products

      Hi there, I'm writing to request a new feature that I believe would significantly improve the user experience in my online store. Currently, on category pages, products are sorted by popularity. However, when a popular product goes "Out of Stock," it

    • POSTMAN - There was an error in evaluating the Pre-request Script:Error: Cannot read properties of undefined (reading 'json')

      I am beginning the journey to learn how to use the API for Zoho Sign. I am getting the following error when I try to use postman. To walk you through how I am getting this error... I wanted to start with a simple GET and expand my learning from there.

    • How do i integrate shipstation with zoho inventory

      Wanting to set up my own delivery driver in ship station so we can get real time tracking of where the package is but then i want it to automatically update zoho inventory packages/shipments how can i do this

    • Invalid value passed for salesorder_id

      Hi, I am using sales return API, details are given below: API: https://inventory.zoho.com/api/v1/salesreturns?organization_id=700571811 Post Json Data: { "salesreturn_number": "", "date": "2020-11-12", "reason": "Testing from API", "line_items": [ { "item_id":

    • Create Invoice and Invoice Items from Sales Order via API

      Currently, when creating an Invoice associated with a Sales Order via the API, it appears that I must manually include all of the items (line_items) even though they are already part of the Sales Order. My question is this: is it possible to raise an Invoice via the API based on all of the information associated with a Sales Order--such as the  items? In other words, do I always have to manually include the items (line_items) when raising an Invoice via the API when the Invoice is associated with

    • Outlook 2013 Calendar Syncs but "Related To" Field in Zoho is blank

      Outlook 2013 Calendar Syncs but Related To Field in Zoho is blank I expect the "Realted To" field to be populated with the calendar participants

    • Export a Course

      Is it possible to export a course from Zoho Learn to a SCORM file?

    • Add and Remove Agents from Departments and Groups in Zoho One

      Hi Zoho Flow Team, We hope you're doing well. Currently, Zoho Flow provides an action to add an agent to a group in zoho one, but there is no action to remove an agent from a group or a department. Another action that we find missing is the option to

    • Consumer Financing

      Does Zoho currently have a payment gateway (such as Stripe, Square, etc) which offers financing for customers? So, let's say the estimate we give the customer is greater than what they can afford at the time, but we can sell the service now, letting them

    • Intégration de la gestion des Passkeys dans Zoho Vault

      Zoho Vault est depuis plus d’une décennie une solution fiable pour les entreprises : pour la gestion, le partage et le stockage des mots de passe. En 2018, nous avons fait un pas en avant en proposant la connexion unique (SSO). Nous sommes fiers de franchir

    • Scan & Fill with double quote key/value pairs

      Hi, An old Ticket moved to a Topic/Idea: I love the idea of the new Scan & Fill as it nearly covers my previous request for a QR Scanner to read a multi-part QR Code. My QR Codes are hard-coded as below: {"key1":"value1","key2":"value2","key3":"value3"}

    • Analytics SQL Queries should allow # as comment

      # and // are very common for commenting in SQL. Not sure why analytics only allows /* and */ for commenting. Especially when # grays the line as if it's being commented out. This should be added for sure.

    • SalesIQ Operator Activity Reports in Zoho Analytics

      I'm busy building a dashboard in Zoho Analytics and I want to include SalesIQ stats in the dashboard, but I'm unable to get the statistics mentioned in the attached image. Any idea where I can get the stats for Operator Activity?

    • No longer can indent

      Hey there! Is it just me or were we used to be allowed to used tab or indent when writing. It’s not working right now, has this always been the case?

    • Next Page