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

    • Is Conditional display of field(s) possible in a Canvas Customer Portal?

      Is Conditional display of field(s) possible in a Canvas Customer Portal? How?

    • View Linked Subscription on Invoice list

      When looking at the list of invoices in billing is it possible to see the subscription that an invoice is for. This would allow you to see if it's a subscription a customer is behind on, or they simply haven't paid a one time invoice.

    • Recording Credit Card Fees when Recording Payment for Bills

      It seems I am unable to record credit card fees when paying a bill. I pay close to 100% of my bills with a company credit card via online portals. I'm happy for the CC fess to be recorded as Bank Charges but it will not allow that field to be used if

    • Workerly/Zoho One Pricing

      Hi What is the pricing model that is suppose to be as a Zoho One user? If i use the services of a freelancers or temp workers (Sometimes for a few hours a week/month), I need to purchase a zoho one license for each of them as well as workerly licenc

    • DKIM

      I have my DKIM in Titan, which is another email service provider. I get this notification on my portal. What shall I do? ( Improve the deliverability of emails sent from Zoho Social by adding DKIM (DomainKeys Identified Mail) records to your DNS settings.

    • Show All Notes For A Single Record

      I would like to be able to view a list of all Notes for a particular record. We can add several (unlimited) Notes for the Leads, Contacts, Accounts and Potentials records. The subject line and some of the note content for up to 10 notes is visible on the first page. You can select the arrow to view additional notes in the list. I would like a button next to the New Note button that says View All. This would bring up a printable list of all notes listed in descending order by Modified Time (newest

    • Zoholics Europe 2025: Build Smarter with the Zoho Creator Low-code Workshop!

      Why should you attend? This year, Zoholics Europe 2025, Zoho’s official user conference, is your opportunity to connect directly with the teams behind the tools you use every day. Don’t miss one of the most requested sessions: dedicated, hands-on workshop

    • Assigning multiple roles to a user in Creator

      Hi I find we can assign only one role and permission to an user in creator. There is a requirement to assign multiple roles and corresponding permission to one user. Is there any solution or workaround for this? Refer the screenshot below

    • 【Zoho CRM】ウィザード機能のアップデート：セクション要素の追加

      ユーザーの皆さま、こんにちは。コミュニティチームの中野です。 今回は「Zoho CRM アップデート情報」の中から、ウィザード機能のアップデートをご紹介します。 ウィザード機能に新たに「セクション要素」が追加されました。 各ウィザード画面内で項目、テキスト、サブフォーム、ウィジェット要素などをより柔軟に整理できるようになりました。 セクション要素とは？ ウィザードの中で、関連する項目や要素をひとつの「サブエリア」 としてまとめられる新しい構成要素です。 セクション要素活用メリット 入力内容やプロセスによっては、より細かな構造や階層化が求められる場合があります。

    • Edit PDFs from within your web app using Zoho Office Integrator

      Hi users, We are excited to introduce PDF editing capabilities in Zoho Office Integrator. You can now open, edit, and collaborate on PDFs from within your web app—in addition to documents, spreadsheets, and presentations—and save them in your configured

    • Zoho Recruit > Job Opening Module> Editing, Deleting, Adding (Fields)

      Hello All In the Job Opening Modules How do i go about deleting the Positing Title or changing to Job Title or can i hide it from all? I want to add a Look Up User Field, however when i select the look up field i do not see that Can i have the industry

    • Can you create a lead without assigning an owner?

      Here is the question I have:   Is there a way I can create a bunch of leads without assigning it an owner?   What I want is for my salespeople to pick and choose their own leads without me assigning them..   right now all leads are owned by me because

    • Bug - Incorrect example in the documentation

      I found an issue in the Zoho API documentation. The example "Sample Request" on this page is incorrect — it shows the example for "Get Email Attachment Info" instead of "Get Email Attachment Content". Wrong example: curl "https://mail.zoho.com/api/accounts/12345678/folders/9000000002014/messages/1710915488416100001/attachmentinfo"

    • Power of Automation :: Dynamically generate Tasklists based on values selected in Task Custom Fields

      Hello Everyone, A custom function is a software code that can be used to automate a process and this allows you to automate a notification, call a webhook, or perform logic immediately after a workflow rule is triggered. This feature helps to automate

    • WhatsApp Enhancements to Boost Customer Engagement

      We're excited to introduce a series of powerful enhancements to the WhatsApp integration in Zoho FSM, making customer interactions faster, smarter, and more actionable—right from your Zoho FSM interface. Here’s a quick rundown of what’s new: Try It Out

    • Store reviews module just got smarter in Zoho Apptics

      Hello, Apptics community! Every app deserves better visibility in the marketplace, and reviews play a crucial role in improving your app's App Store Optimization (ASO), rankings, and credibility across stores. That's why we've rolled out a set of enhancements

    • Try CRM for everyone button in the way of workflow

      Please consider using the bottom bar for offers. Using the top bar for offers like "Try CRM for everyone" really gets in the way of my day to day workflow.

    • Include EVERYTHING in Language Files

      Hey, we are building out a system, that needs to be translated. The language files lack a few things though. 1. Blueprint names 2. Canvas View elements like tab names Please include everything into these files, otherwise it's not really a multi language

    • A way to create kits (groups of items) that do not require bundling and are added to an order as the individual items

      We are evaluating moving off of Sage BusinessWorks (which handles accounting, order entry, inventory control, accounts receivable, etc) to Zoho Books/Inventory. One of the things we heavily use is a feature called Kits, which allows creating a group of

    • Allocating Salesman To Customer

      Hello, please add a feature to allocate a salesman to a particular business customer/account. Regards

    • Shipment

      I have 70 shipments Out of which 40 delivery date are updated( since it is live tracked) 30 numbers i need to update manually. How to do it in bulk?

    • arabic not printing

      Qatar has a legal requirement to have invoices in English and Arabic. When writing invoice fields in Arabic, they don't print. Why?

    • How to show Order Number/SO Ref on Invoice emails

      When creating a sales order or invoice we have an option to input an order number or ref# (see attached images). For the Sales Order email template we can add a placeholder for the SO_REF. However, for the Invoice email template there's no option to reference

    • Specify in-line image size in question

      I have an image inserted into a file upload type question. I can click and drag the corner of the image to make it larger or smaller, but I would like to manually input the dimensions I need. No matter what size I make the image in photoshop before uploading

    • Can you limit who creates tags?

      Hi there, I'd like to find out if it's possible to limit which Agents create tags on Zoho desk. Thank you. 

    • Sudden Layout Issue After Last CSS Update for ZML (Temporary Fix Inside)

      Hi, Our clients have noticed today that every section laid out with ZML suddenly shows an unwanted top padding/blank space that interrupts the user screens. It appears that Zoho has changed the default CSS for the .zcp-col.zcp-panel-rowtype-auto element.

    • Customer paid excess. How do I record payment?

      A customer has paid me Rs. 7150 which is in excess. The amount due is Rs. 5388 I owe them Rs. 1762 back which I will be transferring to their account tomorrow. How do I get this entered into Zoho Books? I'm a little lost. :) Rishi

    • Tabular View Report | Scale To Fit Screen

      Please add the option to scale Tabular View reports to fit the screen. I constantly have to adjust the column size of Tabular View reports to fit various screen sizes and it just looks messy. You can see in the screenshot below there is a blank gap after

    • Why Server error in creatiing Landing Pages

      Hi Zoho Team, pls see my screenshot and tell me, what's wrong. Thx

    • Tip 31: How to make a field in a Zoho Creator form mandatory based on criteria

      Hi folks,   I'm sure most of you are familiar with the Mandatory property available in our form builder. It enables you to ensure that your users enter an input in a required field. If they don't enter an input in that field, they'll be unable to submit

    • Bulk update account type when adding a bill

      Hi I've only been using Zoho Books for a short while but I'm impressed so far, keep up the great work. One minor issue I'm coming up against is when creating a new bill from a scanned document (supplier invoice). In some cases, the supplier invoice could

    • How to start fresh after many years of using Zoho Books without deleting everything and creating a new organisation?

      Hi, I have used Books since 2016, but never reconciled with my bank account. I was thinking of trying to go back and fix that, but I don't just don't have the time it would take. Instead, I'd like back up my old records and start anew. What is the best

    • How do I modify the the incoming/current call popup? I can modify other call pages but not that one.

      I want to modify the incoming and active call popup on the crm to include customer relevant information, such as purchase history or length of relationship. Under modules and fields, I don't seem to see active call as a choice to modify, only the main

    • Canvas: Add Sections to Detail View

      Currently it is only possible to add fields to a canvas detail view. This makes Canvas hard to maintain, because everytime we add a field to our system, someone needs to go into the canvas view and add it there as well. This leads to additional work and

    • Cannot delete old accounts

      Hello, I try to delete old accounts from CRM, but it won't permit, saying documents are still linked to them. I searched in CRM and BOOKS, found some documents and deleted them, but still CRM won't delete them. Any idea how to do that ? I have a lot of

    • Offline mode on Android TV app?

      Hello! Is there a way to use Zoho Show offline in the Android TV app? I have an Android TV based projector, and I travel with it, and don't want to have to rely on a steady internet connection when giving a presentation.

    • Choice-based Field Rules on Global Lists

      Hi, The new Choice-based Field Rules should also be able to work with Global Lists not just local lists. Thanks Dan

    • Tip #36- How to use Survey in Zoho Assist to capture valuable feedback from remote sessions- 'Insider Insights'

      The survey feature allows technicians and customers to share their valuable feedback, contributing to the improvement of remote service quality. After the completion of a remote session, technicians and customers are prompted to fill out a survey form,

    • Narrative 3 - Comprehending User Management

      Behind the scenes of a successful ticketing system - BTS Series Narrative 3 - Comprehending User Management User management in a ticketing system includes important aspects of how administrators oversee user access, roles, and permissions. This process

    • Product Details's Description is lost

      Hi CRM lost its description in Product details subform. Can you make some test before deploy any update?

    • Next Page