Kaizen 223 - File Manager in CRM Widget Using ZRC Methods

Kaizen 223 - File Manager in CRM Widget Using ZRC Methods

Hello, CRM Wizards!



Here is what we are improving this week with Kaizen. 

we will explore the new ZRC (Zoho Request Client) introduced in Widget SDK v1.5, and learn how to use it to build a Related List Widget that integrates with Zoho WorkDrive. It helps users to preview and upload files directly from the record’s detail page.

Why ZRC?

ZRC is a unified client for making REST calls across all developer-facing components in Zoho CRM. It is currently supported in Widgets and CScript, and will soon be available for other features within the Developer Hub as well.

It simplifies external API usage with:
  1. async/await support
  2. Auto JSON parsing
  3. Unified API client for Zoho CRM developer tools (currently supported for CScript and widgets)
  4. Stronger error handling

Business Problem

Zylker, a real-estate company, stores documents, images, and property videos for each lead in a third-party cloud storage platform. 

However, some of these files exceed 20 MB, making the CRM’s built-in file upload field unsuitable. Their team also needs the ability to preview and upload files directly from the Lead detail page.

Solution Overview

Zylker can build a Related List Widget integrated with their third-party cloud storage platform using ZRC methods.

This widget will allow users to:
  1. Fetch and display files inside the folder linked to the Lead.
  2. Preview files (images, PDFs, videos) inside the widget.
  3. Upload new documents to the same folder.
  4. Create new subfolders to keep the data organized. 
  5. Navigate subfolders using breadcrumbs. 
To keep the demo simple, let us walk you through on building this widget for listing, previewing and uploading files using Zoho WorkDrive

Prerequisites

1. Create a Custom Field

Create a Single Line field named WorkDrive Folder ID in the Leads module. Check out the Working with Custom Fields document for guidance.

This stores the folder ID created for each lead through workflow rule that we build in the next steps.

2. Create WorkDrive and CRM Connection

  1. Go to Setup > Developer Hub > Connections and click Create Connection
  2. Choose Zoho WorkDrive with the scopes WorkDrive.files.CREATE and WorkDrive.files.READ
  3. Click the Create and Connect button and proceed to authorize the connection.

  1. Similarly, choose Zoho CRM with the ZohoCRM.modules.ALL scope and create the connection.
Refer to the Connections help doc for more information. Store the Connection Link Name to use while making API calls. 

3. Automate WorkDrive Folder Creation

  1. Go to Automation > Workflow Rules in the Setup page and click Create Rule
  2. Create a Workflow Rule with the following details:
Module: Leads
Trigger: On Record Creation
Condition: All Records
Action: Custom Action (Deluge Function)


Function Logic:

1. Create a new folder in the WorkDrive combining the lead's record ID and First Name as the folder's name. Use the Invoke URL task to make the Create Folder API call. 

responseMap = Map();
attributeInfo = Map();
dataInfo = Map();
headerMap = Map();
headerMap.put("Accept","application/vnd.api+json");

// First Name and Record ID from the argument

AttributeInfo.put("name",Name + recordId);

// Parent folder ID under which you want to maintain the lead folders

attributeInfo.put("parent_id","e8gn06f2d7b3a48044090b7217524be95c9ac");
dataInfo.put("attributes",attributeInfo);
dataInfo.put("type","files");
responseMap.put("data",dataInfo);
folderCreateResponse = invokeurl
[
url :"https://zohoapis.in/workdrive/api/v1/files"
type :POST
parameters:responseMap.toString()
headers:headerMap
        connection:"workdrive_oauth_connection" // Connection Link Name created in the prerequisites  
];
info folderCreateResponse;

2. Retrieve the folder ID from the API response.

3. Update the Lead’s WorkDrive Folder ID field with this folder ID using Update Records API call. 

requestBody = Map();
dataList = List();
record = Map();

// Set field values

record.put("WorkDrive_Folder_ID",driveId);

// Add record to list

dataList.add(record);

// Wrap data

requestBody.put("data",dataList);
updateLead = invokeurl
[
url :"https://zohoapis.in/crm/v8/Leads/" + recordId
type :PUT
parameters:requestBody.toString()
connection:"crm_oauth_connection"
];
info updateLead;

Assign values to the arguments using merge fields while associating the function with Workflow Rule.



Now every Lead has its own WorkDrive folder before the widget loads. 

Notes
Note:

The complete code snippet for the deluge function is attached to the post for your reference. 

Building the Related List Widget

Step 1: Initialize the Widget Project

Review the basics from our earlier Kaizen on CLI Installation, Creating a Widget Project, and Internal hosting of the same.

Step 2: Develop your Widget

After setting up the widget project using CLI, implement the following code logic for the case we are discussing:
  1. Get the current record's ID from the PageLoad event. 
  2. With the record ID, fetch the lead details using the GET Records API call using the GET ZRC method as shown here. 
// data.Entity and data.EntitiyId are the module and record ID from PageLoad
const response = await zrc.get(
      "/crm/v8/" + data.Entity + "/" + data.EntityId
    );
 var workdriveFolderId = response.data.data[0].WorkDrive_Folder_ID;
  1. Extract the WorkDrive Folder ID from the response to get the list of files from the folder. 
  2. Since we'll be using WorkDrive APIs multiple times, let’s create a reusable instance with the Connection Link Name and API's base URL. This way, we avoid repeating the same setup for every API call.
Following is sample of how to create a custom instance:

workDriveZrc = zrc.createInstance({
    baseUrl: "https://www.zohoapis.in/workdrive/api/v1",
    connection: "workdrive_oauth_connection",
 });

You can also check out the Create Instance in the requestConfig help section to learn more. 
  1. Now, let us make the GET List of Files/Folder API call using the newly created ZRC instance.  
let apiResponse = await workDriveZrc.get(
        "/files/" + workdriveFolderId + "/files",
        {
          headers: {
            Accept: "application/vnd.api+json",
          },
        }
 );
  1. Display the file details like File Name, Type and Modified Time in a table from the API response. Save the File ID in a variable for displaying preview. 
  2. When user clicks a particular file, use the file ID to fetch the preview URL using the GET Preview Meta Data API. Then load the preview URL in an iframe to display the file. 
try {
      const previewResponse = await workDriveZrc.get(
        "/files/" + resourceId + "/previewinfo",
        {
          headers: {
            Accept: "application/vnd.api+json",
          },
        }
      );
      parsed = JSON.parse(previewResponse.data);
      console.log("Preview Data:", parsed);

      // Extract the preview_url from the expected location

      previewUrl = parsed && parsed.data && parsed.data.attributes && parsed.data.attributes.preview_url || null;

      // Remove surrounding quotes if server wrapped the url in quotes

      if (typeof previewUrl === "string") {
        previewUrl = previewUrl.replace(/^"(.*)"$/, "$1").trim();
      }
    } catch (err) {
      console.error("Error fetching preview info for resource:", resourceId, err);
 }
function showPreview(previewUrl, fileName, permalink) {
  var modal = document.getElementById("modal-container");
  var thumbnailFrame = document.getElementById("thumbnail-img");
  var caption = document.getElementById("caption");
  var workdriveLink = document.querySelector(".redirect-workdrive");

  // Load the preview URL into the iframe

  thumbnailFrame.src = previewUrl;

  // Set the file name in caption and workdrive link

  caption.textContent = fileName;
  workdriveLink.setAttribute("data-link", permalink);

  // Show the modal

  modal.style.display = "block";
}
  1. Create an Upload button for users to select files from their local. Convert the streamed files to blob and execute Upload API call using the custom ZRC instance. 
async function workdriveUpload(file, fileType, fileName, folderId) {
  const fileBlob = new Blob([file], { type: fileType });
  try {
    const formData = new FormData();
    formData.append("filename", fileName);
    formData.append("parent_id", String(folderId).trim());
    formData.append("content", fileBlob);
    const uploadResponse = await workDriveZrc.post(
      "/upload", formData,
      {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      }
    );
    console.log("Upload response:", uploadResponse.data);
    return uploadResponse;
  }
  catch (error) {
    console.error("Error uploading file:", error);
    throw error; 
  }
}

Step 3: Validate and Pack

Follow the steps given in the Widget help page to validate and package the widget.

Step 4: Upload to Zoho CRM

  1. Go to Zoho CRM > Setup > Developer Hub > Widgets and click Create New Widget.
  1. Fill in the required details such as:
Name: Zoho WorkDrive
Type: Related List 
Hosting: Zoho 
File Upload: Upload the ZIP created in the dist folder within the widget project directory after packaging in the Step 3. 
Index page: /widget.html
  1. Create a related list in the Leads module and associate this widget. Refer to the Customize Related Lists help page for more information on creating a related list.

Try it Out!

A complete working code sample of this widget is attached at the bottom of this post for reference. 

Now let us see how this works from the Lead's detail page:

1. Listing the available files from Zoho WorkDrive on page load. 


2. Uploading new files to the folder.


3. Previewing all the listed files.


We hope this Kaizen helps you explore the new ZRC capabilities and build seamless file-management experiences in Zoho CRM.

Have questions or suggestions? Drop them in the comments or write to us at  support@zohocrm.com

We will circle back to you next Friday with another interesting topic. 

On to Better Building!

------------------------------------------------------------------------------------------------------

Related Reading

2. Connections - An Overview
4. CRM APIs - GET Records and Update Records 
6. CRM Customizations - Related Lists and Custom Fields.
------------------------------------------------------------------------------------------------------

Idea
Previous Kaizen: Client Script Support for Notes Related List | Kaizen Collection: Home


    Access your files securely from anywhere


            All-in-one knowledge management and training platform for your employees and customers.






                                  Zoho Developer Community




                                                        • Desk Community Learning Series


                                                        • Digest


                                                        • Functions


                                                        • Meetups


                                                        • Kbase


                                                        • Resources


                                                        • Glossary


                                                        • Desk Marketplace


                                                        • MVP Corner


                                                        • Word of the Day


                                                        • Ask the Experts



                                                                  • 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


                                                                  Manage your brands on social media



                                                                        Zoho TeamInbox Resources



                                                                            Zoho CRM Plus Resources

                                                                              Zoho Books Resources


                                                                                Zoho Subscriptions Resources

                                                                                  Zoho Projects Resources


                                                                                    Zoho Sprints Resources


                                                                                      Qntrl Resources


                                                                                        Zoho Creator Resources



                                                                                            Zoho CRM Resources

                                                                                            • CRM Community Learning Series

                                                                                              CRM Community Learning Series


                                                                                            • Kaizen

                                                                                              Kaizen

                                                                                            • Functions

                                                                                              Functions

                                                                                            • Meetups

                                                                                              Meetups

                                                                                            • Kbase

                                                                                              Kbase

                                                                                            • Resources

                                                                                              Resources

                                                                                            • Digest

                                                                                              Digest

                                                                                            • CRM Marketplace

                                                                                              CRM Marketplace

                                                                                            • MVP Corner

                                                                                              MVP Corner









                                                                                                Design. Discuss. Deliver.

                                                                                                Create visually engaging stories with Zoho Show.

                                                                                                Get Started Now


                                                                                                  Zoho Show Resources

                                                                                                    Zoho Writer

                                                                                                    Get Started. Write Away!

                                                                                                    Writer is a powerful online word processor, designed for collaborative work.

                                                                                                      Zoho CRM コンテンツ




                                                                                                        Nederlandse Hulpbronnen


                                                                                                            ご検討中の方





                                                                                                                      • Recent Topics

                                                                                                                      • Enable Credit Note creation for Sales Returns BEFORE receiving goods

                                                                                                                        Currently, it is not possible to issue a Credit Note linked to a Sales Return until the goods have been officially marked as "received" in the system. In our business, we often need to issue a credit note to our clients immediately upon the initiation
                                                                                                                      • Best way to setup Inventory bin tracking for products with multiple boxes/crates

                                                                                                                        Hi - we need some advice from the community on setting up Items in the Inventory for products with multiple crates. We have large products in our warehouse where the product is delivered as two large (double pallet) crates. We've setup the Items for these
                                                                                                                      • Getting Internal Server Error message when filing for MTD

                                                                                                                        I am trying to file for the MTD submission, and after I filled in all the information and click (Fetch Obligation) this message "Internal Server Error [500]" pops up. I have been trying for awhile and its still the same. What shall I do as today is deadline
                                                                                                                      • No access to change view permission for team members

                                                                                                                        Hi, I want team members to be able to update the percentage progress on their goals at mid year. Currently they cannot edit this, they can only update the comments against the goals. The ability to add view permission to goal progress for team members
                                                                                                                      • Turn your Zoho One Home into your workspace with Dashboard 2.0

                                                                                                                        When you open Zoho One, you probably don't need to see everything. You need to see what matters to you. A sales manager may want to track pipeline and revenue. An HR manager may want to monitor employee information. A business leader may want a quick
                                                                                                                      • Zoho Assist Feature Update: August 2026

                                                                                                                        Web Forms Web Forms in Zoho Assist help you collect support requests directly from your website and route them to the right team. Embed a customizable form so customers can raise issue details or join an active remote session using a session ID. Depending
                                                                                                                      • Tip #84 – A More Natural Remote Experience with Custom Cursor Support – 'Insider Insights'

                                                                                                                        Hello Zoho Assist Community! Anyone who has spent time in a remote support session knows the feeling. You're guiding a customer through a task, moving the cursor across the screen, and something feels just slightly off. The cursor doesn't behave the way
                                                                                                                      • 【無料/オンライン】8/20開催|Zoho ワークアウト|ユーザー同士で学び合うオンラインもくもく会

                                                                                                                        ユーザーの皆さま、こんにちは。 コミュニティグループの中野です。 8月20日(木)開催の「Zoho ワークアウト」をご案内します。 Zoho ワークアウトは、参加者それぞれが取り組みたいテーマを持ち寄り、 ユーザー同士で交流しながら、設定・検証・運用改善を進めるオンラインの「もくもく会」です。 「作業を進めたいけれど、一人だと手が止まってしまう」 「他社がどのように活用しているのか知りたい」 「同じ課題を持つユーザーと情報交換したい」 そんな方は、ぜひお気軽にご参加ください。 ▶︎ 参加登録はこちら(無料)
                                                                                                                      • Assign Price Book to Accounts (again!)

                                                                                                                        I can see this topic has been bumping about for over 10 years and unfortunately Zoho hasn't seen the need (or use case) in CRM to be able to assign an account to a price book to automate quoting (amongst other things). Strange given they DO assign price
                                                                                                                      • Custom Statuses - Can You Do Anything With Them?

                                                                                                                        As far as I can tell, one really cannot do much with custom statuses. I created a new custom status for sales orders called "Customizing / Hold". This is for sales orders that have the Confirmed status. The use case here is that, as an e-commerce company,
                                                                                                                      • Price Book in foreign currency

                                                                                                                        We have many customers who buy in foreign currency (USD), where our base currency is our local currency (AUD). It would be normal (it is in Zoho Books, Zoho Inventory etc.) to assign a currency to a price book, but I cannot find this option in Zoho CRM
                                                                                                                      • How to disable option to search (In Advanced Field > Matrix Choice > Dropdown)

                                                                                                                        In Advanced Field > Matrix Choice > Dropdown I don’t want the option to search or type to fill in words. How can I disable or remove this function?
                                                                                                                      • Layout rules in Zoho FSM

                                                                                                                        As titled, is there an item in the pipeline or an ETA for the implementation of layout rules in Zoho FSM? Similar to how they work in Zoho CRM https://help.zoho.com/portal/en/kb/crm/customize-crm-account/customizing-page-layouts/articles/create-conditional-layouts
                                                                                                                      • Marketing Tip #45: Use WhatsApp to engage customers and drive more sales

                                                                                                                        Email is great. Social media is useful. But when it comes to getting a message actually read? WhatsApp wins. In general, open rates on WhatsApp messages are significantly higher than email, and the conversation feels personal rather than promotional.
                                                                                                                      • Client Script also planned for Zoho Desk?

                                                                                                                        Hello there, I modified something in Zoho CRM the other day and was amazed at the possibilities offered by the "Client Script" feature in conjunction with the ZDK. You can lock any fields on the screen, edit them, you can react to various events (field
                                                                                                                      • View Answer Bot conversations?

                                                                                                                        We are trialing Zia and are experimenting with Answer Bot on our knowledge base. So far so good! Management asks me if it is possible to view Answer Bot conversations, the purpose being to look over its shoulder and confirm that it is working as des
                                                                                                                      • Add Comment workflow action delayed by 1–2 minutes in Zoho Desk

                                                                                                                        Hello Zoho Support team, We are experiencing an issue with a workflow in Zoho Desk. The workflow is triggered when the Quote ID field is updated and performs two actions: A standard Field Update An Add Comment custom action When the Quote ID field is
                                                                                                                      • Where do I edit the "Welcome to [portal name]" message

                                                                                                                        I am looking for a way to edit the "Welcome to" part of the message that is seen on the landing page (ex: https://help.zoho.com/portal/en/home). When I use the French interface, it doesn't make sense... I want to change it from "Bienvenue chez" to" Bienvenue au". Thanks!
                                                                                                                      • Zoho Books | Product updates | August 2026

                                                                                                                        Hello users, July has been an exciting month for Zoho Books! This month, we're excited to introduce HTML PDF Templates, Placeholders as Pills, expanded approval workflows for Sales Returns and Journals, and significant compliance updates across the India,
                                                                                                                      • Zoho CRM Layout Rules: Nine New Actions, Profile-Based Execution, and Interactive Preview

                                                                                                                        Hello everyone, Availability: This feature is now available for customers in the JP and SA DCs. It is planned to be released for other customers in soon. We’re excited to announce powerful new enhancements to Layout Rules in Zoho CRM - a feature built
                                                                                                                      • Zoho Books and TRAINING SALES receipt label for eTims?

                                                                                                                        Hi, Can Zoho Books implement TRAINING SALES receipts and push them to eTims for test? In other words how can we send to Zoho or even create in Zoho training mode invoices and TEST the workflow POS>Zoho Books>eTims and back without actually registering
                                                                                                                      • Reporting Tags and COGS

                                                                                                                        Is there any way to get COGS recorded against reporting tags? The use cases seems very straightforward to me. If I'm running a P/L report against a specific reporting tag (I use mine for customer type, but it could be used for regions, etc.), the revenue
                                                                                                                      • Hide Custom Fields for Customers or Vendors

                                                                                                                        For whatever reason, all custom fields added to the Customer module also get added to the Vendor module. This leads to a clunky experience for users, as many custom fields we add only apply to one or the other. There should be a "hide" option to hide
                                                                                                                      • Onboarding process

                                                                                                                        I urgently need onboarding support. My account still shows trial period.
                                                                                                                      • Detailed General Ledger - Display Transaction Description in Reports

                                                                                                                        Hi Zoho Team, I'm currently using Zoho Books and have a question regarding the Detailed General Ledger report. When we enter a description or narration in transactions (Bills, Journal Entries, Expenses, etc.), the report does not display this description.
                                                                                                                      • Zoho Mail Does Not Integrate with Analytics

                                                                                                                        Hello everyone, Just wanted to make a quick post about the problem with zoho mail. Currently it does not connect to Zoho Analytics, which I think is crazy considering both of these applications have existed for a long period of time. Even zoho voice a
                                                                                                                      • Net ##th Terms (e.g. due on the following 15th)

                                                                                                                        I have a client who pays me twice monthly per our contract. It would be helpful to have terms on my invoices where the invoice is due on the 15th or the 30th of the same or the following month.
                                                                                                                      • Project status update visibility within a project

                                                                                                                        Currently the only place within Zoho projects to see status updates for a given project is actually not in the project it's self it's in the Collaboration section and then by searching for a given project and clicking on the status tab. It would be great
                                                                                                                      • Using custom CRM fields

                                                                                                                        I have created a series of fields in the Deals module that need to be linked to fields in a contract I have customized. I can only see how to map standard fields, not the custom ones. How do I do this?
                                                                                                                      • Como limitar o Zia Agent?

                                                                                                                        Geralmente quando estamos criando um agente de IA no ZIa Agent Studio, colocamos o que ele deve fazer, utilizando as instruções que colocamos no Knowledge Base. Mas como colocamos limites que não devem ser ultrapassados? Para isso utilizamos os Guardrails,
                                                                                                                      • An important update for Zoho Cliq desktop users

                                                                                                                        The latest version of the Zoho Cliq desktop app (v1.8.0) will no longer be supported on macOS 10.15 Catalina and earlier versions. This is because the framework we use (Electron) no longer supports some older macOS versions. If you’re using macOS 10.15
                                                                                                                      • All new Address Field in Zoho CRM: maintain structured and accurate address inputs

                                                                                                                        Availability Update: 29 September 2025: It's currently available for all new sign-ups and for existing Zoho CRM orgs which are in the Professional edition exclusively for IN DC users. 2 March 2026: Available to users in all DCs except US and EU DC. 24
                                                                                                                      • Zoho Flow - Zoho Desk trigger "Ticket created or updated" overrides Department

                                                                                                                        Just in case anyone else has this issue. We had a Zoho Flow with the Zoho Desk trigger "Ticket created or updated". In the trigger I had selected a Department (Sales). What happens is that the Department ID (Sales) is submitted as part of the request
                                                                                                                      • 2026 Product Roadmap and Upcoming Features

                                                                                                                        This is your guide to what is coming in Zoho Vertical Studio throughout 2026. We’ll update this post throughout the year as items move from development to release, and as and when new initiatives are added. Once a feature is released, it will be reflected
                                                                                                                      • Introducing Canvas templates: Design once, apply everywhere

                                                                                                                        Greetings all! We're happy to introduce Canvas templates, a Forms view enhancement that enables you to design form layouts just once and apply them seamlessly across multiple modules. Imagine you use five CRM modules (Contacts, Deals, Leads, and more),
                                                                                                                      • Zoho Projects - Will there ever be a send email feature in Zoho Project?

                                                                                                                        Hi team, Are there plans to or will there ever be a sendemail feature in Zoho Projects, brining it in line with other similar platforms like Asana, ClickUp and Monday? I know that you can add comments via email to a specific task, but I believe this only
                                                                                                                      • Why cant i see the Campaigns module in my Zoho app

                                                                                                                        I am on the ZOHO CRM Standard edition. I can clearly see and use the Campaign module when viewing the ZOHO CRM desktop. When I switch to my phone, the Campaign Module does not show. I have gone through all the settings I can think of, but I still can't
                                                                                                                      • 📣 Ask the team behind Zoho SalesIQ: Summer '26 Q&A

                                                                                                                        Hi everyone! Following our recent webinars, Summer '26 Release: What's New in Zoho SalesIQ—where we walked you through all the new features, what they do, and how they work—and Driving the AI Evolution: Building Smarter Customer Experiences with Zoho
                                                                                                                      • Always display images from this sender – Is this feature available?

                                                                                                                        In Zoho mail, I had my "Load external images" setting set to "Ask me", and that's fine. That's the setting I prefer. What's not fine though is I always need to tick "Display now" for each email I get, regardless if I've done that multiple times from several
                                                                                                                      • Set Custom Icon for Custom Modules in new Zoho CRM UI

                                                                                                                      • Next Page