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

    • Keeping Track of Email Threads

      Hi, Z CRM is great for tracking all the activities one would want to track whilst qualifying leads, converting to customers, closing deals etc etc, however.... ....although I can use Z CRM to send an email to a lead/contact and have that recorded as an activity for other team members to see, there is no way of capturing an inbound email from that lead. Assume my lead replies to my email sent from ZCRM, in my case, the response arrives in my ZMail account. However I can't get it back into ZCRM to

    • Zoho Creator invokeUrl to retreive PDF

      I'm trying to retreive a record PDF to send to Print Node. Tried with and without the zoho_creator_connection. pdf_content = invokeurl [ url :"https://creatorapp.zoho.com.au/<org_namespace>/<app_link_name>/record-pdf/<report_link_name>/" + input.ID type

    • Zoho App Builder

      I’m looking for a Zoho Creator developer to build a simple app for tracking site expenses for a construction company. Key features: mobile form, dropdowns for projects and expense types, photo attachment for invoices, auto-calculated totals, and Excel

    • Captcha can't be enabled conditionally

      Hi Problem: captcha on a form can't be enabled conditionally. Why is this a problem: Because I use the same form on our website (public) in the portal and mobile app. In the portal it works but in the mobile app it doesn't. So there should be a way to

    • ACH Returns Don’t Trigger Dunning or Reverse Payment in Zoho Subscriptions

      Zoho Billing marked an ACH payment as successful and kept the subscription active — even though the payment was later returned by the bank (NSF). There was no update to the invoice or subscription status, and I had to manually clean it all up. For credit

    • Zoho Sheet - Split cell diagonally fill half color

      is it possible to split a cell diagonally, fill different text in each half and ideally color them differently as well?

    • Calling Token API in Postman returning "error: invalid_client"

      Hello, I've been working on setting up an API to get data from zoho crm into a third-party application. I'm currently testing the setup in Postman, but I'm getting an error from the API to retrieve the access token. It keeps returning "error: invalid_client".

    • How to handle this process need using a Blueprint?

      See one minute screen recording: https://workdrive.zohoexternal.com/external/eb743d2f4cde414c715224fc557aaefeb84f12268f7f3859a7de821bcc4fbe15

    • bulk scheduling youtube shorts and facebook reels

      how do i flag the video as facebook reel rather than normal video, it's vertical, 20 seconds, yet still being posted as video on facebook for youtube, it's being rejected out right both videos are to standard, can be posted normally with normal scheduler

    • Invitation-Based User Access in Zoho Analytics

      Hello everyone, We’re rolling out an important update on how users are added to your Zoho Analytics Organization and Workspaces. Previously, when admins added users, they were automatically added to the organization. Moving forward, to improve security

    • Filtert products by multi select custom field

      Hello, this is seems like a must addition, why it can not be done now?

    • Multiple images

      Hi Is there a way to insert multiple images in one image record or any way that instead of one image, I could upload 5 to 10 images together. Looking forward for a solution. Regards

    • Zoho Projects - Custom Objects

      Hello, is there the ability now, or in the near future, to add custom objects to Zoho Projects? The requirement here would be to have the ability to track change requests to a project's budget. The idea here is to have the ability to create a custom Object

    • Access CRM Variables from Formula field

      Is it possible to use a CRM variable (defined in Developer Space -> CRM Variables) in a formula field for calculations ?

    • Announcing Bigin India Meetups Across 8 Cities: July 29 - Aug 07

      Hello Biginners, We've got some exciting news to share! We're hosting our first round of Customer Meetups for 2025 in India, from 29th July - 9th August. Whether you're a Bigin newbie or a seasoned pro, this is your chance to meet customers from your

    • Why isn't there an Expense description field / column?

      Hello! I'm new to Zoho Books and accounting. I'm surprised there isn't a proper expense description field (and column in the overview "all expenses" page)? I thought this was a given in accounting, as visualizing expenses facilitates tracking them down?

    • New in Zoho PDF Editor: Watermarks, password protection, signature collection, and more.

      Hi Zoho Sign users! We are delighted to introduce the latest enhancements to Zoho PDF Editor, designed based on user feedback and feature requests. This update enables you to reorder, extract, and rotate PDF pages, add watermarks, and collect signatures.

    • Printed Reports, Increase Font SIZE

      I need to send some printed copies of financial reports to my attorney. The reports print out with microscopic fonts. How do I increase the font size so that a normal human can read the text? Every other accounting app can do this so I imagine I have

    • Avoid email sending!

      Hello, Thanks you Zoho for the wonderful apps you provide. Question: Is there a way to disable sending emails when: - creating an estimate or billing. Thanks Tommy

    • Need to show discount before total after subtotal

      Need to show discount before total after subtotal on my estimate template (see attachment)

    • Email a "thank you" note for this payment is NOW checked by default

      Hello Team, Just noticed that Email a "thank you" note for this payment is now checked by default. I tried searching in Preferences and there is no way to turn this off. I do not want this to be the default. Is there a way to turn this off?

    • End-to-end services hours

      We are trying to determine the best method of quoting service hours on quotes but only present the sum amount to a customer, without losing the tracking of quantity of hours for invoicing purposes. Does anyone have a good method they have determined?

    • Specific Approval Question

      Hi everyone, Just a quick question here. I have located the "Approval Type" in the preferences, which is great, and I am sure we could make use of it. However, I am trying to understand how I can implement an approval "workflow". The business call it

    • Zoho Books - Show Discount Totals When Greater Than Zero

      Hi Books Team, I understand that to show or hide discount amount on a Quote or Invoice, I need to use different templates. It would be a great quality of life improvement for users if we had an option to show or hide the discount amount at line item and

    • Specifying a filename for Schedule Reports

      Is it possible to specify a filename to use with scheduled reports? For example: With a general ledger report, instead of general_ledger.pdf I would like to include the date the report was generated in the filename so it is called general_ledger_202

    • Need to upsert "Created Time" field in Leads Module

      I am in the process of implementing Zoho CRM for my business. I need to modify the "Created By' field to reflect the actual date/time the lead was captured in my original Excel file. Otherwise, my conversion velocity data will always be inaccurate, which

    • HTML for confirmation email

      Hi, After a prospect submitted the Zoho form, we want to send a confirmation mail. In this mail we want to add our email signature. However, while this is possible in Zoho CRM this doesn't seem to be an option in Zoho Forms. Also an html editor is not

    • Fire a webhook when the user gets access to portal

      Hello, We would like to know if there is any way in which we can automate a webhook call if the user accepts the portal invitation that Zoho sends by email. The customer module does have the option to trigger webhooks when a customer is created, updated,

    • Creating Payrun summary by fetching values from the employee payruns and adding them

      I am trying to make a processing payrun module. I want on Form load to autofill payrun summary eg Total Deductions, Total employer contributions etc by fetching one value after the other in the employee payrun information. So it should loop through the

    • Feature Request - Zoho Books - Add Retainer Invoices to CRM/Books integration

      Hi Books Team, My feature request is to include Retainer Invoices in the finance suite integration with Zoho CRM. This way we will be able to see if retainer invoices have been issued and paid. I have also noticed that when the generate retainer invoice

    • Books <-> CRM synchronisation with custom Fields

      Hello, We are synchronising Books Customers with CRM Accounts. In CRM Accounts I set up last year a "segments" multiselect field shown below In Books, I set up a custom multi-select field with the same value as in the CRM And set up the synchronisation inside Books. Want to synchronise the Books Segments with the CRM Segments, but the later doesn't exist, and another non-existing is there ?! First, I don't understand where the field Segmentation is coming from. Second, I set CRM Segmentation to sync

    • Edit Reconciled Transactions

      I realize transaction amounts and certain accounts cannot be edited easily once reconciled, but when I audit my operational transactions quarterly and at the end of the year sometimes I need to change the expense account for a few transactions. To do

    • Request to Customize Module Bar Placement in New Zoho CRM UI

      Hello Support and Zoho Community, I've been exploring the new UI of Zoho CRM "For Everyone" and have noticed a potential concern for my users. We are accustomed to having the module names displayed across the top, which made navigation more intuitive

    • Sending campaigns from other server

      Hi, Is it possible to send campaigns from another server so customers can see mail direct from our company (Corrata) and not from ZCSend.net? Thanks, Tim

    • Edit a previous reconciliation

      I realized that during my March bank reconciliation, I chose the wrong check to reconcile (they were for the same amount on the same date, I just chose the wrong check to reconcile). So now, the incorrect check is showing as un-reconciled. Is there any way I can edit a previous reconciliation (this is 7 months ago) so I can adjust the check that was reconciled? The amounts are exactly the same and it won't change my ending balance.

    • Admin and Dispatcher Users show as Field Technicians in Dispatch Module?

      Hi Zoho, Our Admin and Dispatch user both show up as Fied Technicians / Field Agents in the Dispatch module, but they most certainly should not be assigned to any of the work orders and service appointments. These users are NOT service resources. How

    • Zoho Payroll: Product Updates - June 2025

      This June, we’re taking a giant step forward. One that reflects what we’ve heard from you, the businesses that power economies. For our customers using the latest version of Zoho Payroll (organizations created after Dec 12, 2024) in the United States,

    • View Products (items) in Contact and Company

      Hi, I would like to know if there is an option to view all the products /(items) that were inserted in the pipeline deal stage for exemple "Win Pipeline" within the company and contacts module section? For instance, view with the option filter for the

    • Update subform dropdown field choices - on load workflow

      Hi, I have a "Check In" form that has "Contacts" subform and a "Tickets" subform. When the form is loaded, I want to populate one contact and the number of tickets. I want the "Contact" field in the "Tickets" subform to have the choice of "Contacts."

    • Upload Zoho Inventory Item Image by API

      itemID = item.get("item_id"); organizationID = organization.get("organization_id"); resvp = zoho.inventory.getRecordsByID("items",organizationID,itemID,"zoho_inventory_conn"); info resvp; image_file = invokeurl [ url: "https://t4.ftcdn.net/jpg/03/13/59/81/360_F_313598127_M2n9aSAYVsfYuSSVytPuYpLAwSEp5lxH.jpg"

    • Next Page