Kaizen #194 : Trigger Client Script via Custom buttons

Kaizen #194 : Trigger Client Script via Custom buttons



Hello everyone!

Welcome back to another interesting and useful Kaizen post.

We know that Client Scripts can be triggered with Canvas buttons and we discussed this with a use case in Kaizen#180. Today, let us discuss how to trigger Client Script when a Custom Button is clicked. Using this, you can execute Client Script when a custom button is clicked.

In this post,

1. Event Details 
2. Supported Pages
3. Use Case - Export Subform Rows to Zoho Sheet in a Single Click!
4. Solution
5. Summary
6. Related Links


Client Script support for Custom Buttons opens up possibilities for automation, personalization, and enhanced user interactions in Zoho CRM when a custom button is clicked.
Here is a detailed walkthrough to help you understand it better.

1. Event Details 

The Button event triggers the Client Script when a custom button is clicked. Each time this event is invoked, the context argument is passed to the Client Script. The context contains information about the page from which the button was clicked.


Click here to know more about Client Script Events.

2. Supported Pages

A Custom Button can be placed in different positions based on the Page.


You can add a  custom button in the Util Menu, in Each Record or in the Mass Action Menu of the List Page.


Also, a Detail Page can have a custom button either In Record or in the Related List. Click here for more details about the different possible positions of a custom button.

The following table lists the supported pages and the corresponding context argument, which provides different details based on the page type.


To create a Client Script and make it trigger when a custom button is clicked, first create a Custom button and associate it with a Client Script as shown in the following image.


 Click here to view the steps to create a custom button and configure a Client Script. 

Note:

You can configure the Client Script only from the Buttons page to trigger it when a user clicks a custom button, and not the usual way of Creating Client Script via setup page. Once a script is created, it can be edited and updated from the Client Script setup page

3. Use Case - Export Subform Rows to Zoho Sheet in a Single Click!

Zylker manufactures medical instruments, and its sales representatives frequently need to share bulk order details with distributors and hospital partners using Zoho Sheets. These details such as product names, quantities, and prices are captured in a Subform on the Purchase Order Detail(Standard) Page.
To simplify this, the admin wants to add a custom button called "Export Products" on the Purchase Order Detail Page. When clicked, it should export the Purchase Items from the Subform and move the content to the specified sheet.

4. Solution

To export subform rows to Zoho Sheet with a single click, you can add a custom button to the Detail Page of the record. When clicked, a Client Script will be triggered to fetch the subform data from the Detail Page and pass it to a Function that uses zoho.sheet.createRecords() to insert data into Zoho Sheet.

Here’s how to implement this:

  • Add  “Export Products” custom button on the Detail Page.
  • Add the script to collect subform rows which invokes the Function.
  • Write a Function to create entry in Zoho Sheets  

A. Add “Export Products” custom button on the Detail Page.

  • Go to Setup → Modules and Fields under Customization.
  • Select a Module as Purchase Order.
  • Click on Buttons → Then click + New Button.
  • Enter Button Name and select Action Type as "Client Script"
  • Choose Button Position and Layout details as shown in the following image.
  • Click Create in Configured Client Script, enter the script, and click Add.
  • Select the profiles for which these buttons should be visible.
  • Click Save.



B. Add the Script to collect subform rows and invoke the Function

Use the following Client Script when you configure the custom button.

  1. var casesheetid = ZDK.Client.getInput([{ type: 'text', label: 'Enter the Sheet ID' }], 'Sheet details', 'OK', 'Cancel');
  2. if (casesheetid == null) {
  3.         ZDK.Client.showAlert("Enter the *Case Sheet ID - Import* to import data");
  4.  }
  5. var purchase_items = ZDK.Page.getField('Purchase_items).getValue();
  6. ZDK.Client.showLoader({type: 'page', template:'spinner', message: 'Export in progress, please wait'});
  7. var c=1;
  8. if (sheetid == null) {
  9.     ZDK.Client.hideLoader(); 
  10.     ZDK.Client.showAlert("Enter the *Case Sheet - Export* ID to export data");
  11. }
  12. purchase_items.forEach((r,i) => {
  13.             try {
  14.                resp = ZDK.Apps.CRM.Functions.execute("csvWrite", { "Product_Name": r.Product_Name.name, "List_Price": r.List_Price, "Discount": r.Discount, "Total": r.Total,"Sheetid":casesheetid }); }
  15.             catch (error) {
  16.                 c = 0;
  17.                  ZDK.Client.hideLoader(); 
  18.                 ZDK.Client.showAlert("Unexpected issue occured while adding data in row number "); }
  19.     });
  20.     ZDK.Client.hideLoader(); 
  21.     if (c) {
  22.         ZDK.Client.showMessage("Export completed. Please check the Sheet");
  23.     }
  24.     else
  25.     {
  26.        ZDK.Client.showMessage("Unexpected error "); }}

In this code, several ZDKs are used for various purposes. Click on the ZDK hyperlinks to learn more.


Note

The Client Script you intend to link with the button will be saved only after the custom button is saved.

C. Write a Function to create entry in Zoho Sheets 

  • Go to Setup > Developer Hub > Functions.
  • In the Functions page, click + Create New Function.
  • Choose the category as Button.
  • Click Create.
  • In the Create Function page, enter a name as csvWrite and description for your function.
  • Enter the following function code and click Save.
  1. string standalone.csvWrite(String product,String qty,String up,String amt, String Sheetid){
  2. queryData = Map();
  3. writeData = Map();
  4. header = Map();
  5. writeData.put("Product",product);
  6. writeData.put("Quantity",qty);
  7. writeData.put("Unit_Price",up);
  8. writeData.put("Amount",amt);
  9. SheetData = zoho.sheet.createRecords("Sheetid","Sheet1",writeData,queryData,"sheetconnection");
  10. return SheetData;
  11. }

Click here to know more about zoho.sheet.createRecords().

In the code above:
  • sheetconnection refers to the name of the Zoho Sheet connection, which must have the scopes: ZohoSheet.dataAPI.UPDATE and ZohoSheet.dataAPI.READ.
  • Click here to know how to create a Connection with the required scopes.
  • sheetid is the unique identifier of the Zoho Sheet, available in the sheet’s URL.
  • Sheet1 represents the name of the worksheet (i.e., the tab name shown at the bottom of the Zoho Sheet).
  • Now, when the custom button is clicked, the Client Script is triggered. It prompts for the Sheet ID, fetches the contents of the Purchase Order subform, and invokes a function that writes the content to the Sheet.
Here's how the Client Script works.



5. Summary

In this post we have seen,
  • What is a Button event?
  • How to configure Client Script for a custom button
  • How to write data into Zoho Sheets from Client Script
  • How to create a Function and call it from Client Script

6. Related Links


We are thrilled to be nearing the 200th post in our Kaizen series. As we approach this exciting milestone, we would love to hear from you. Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your input helps us improve and shape the series to serve you better.

Please take a moment to share your thoughts using ✨ this form ✨

We hope you found this post useful!

Happy Client Scripting! 😊

    Access your files securely from anywhere

        Zoho FSM Video Tutorials

          Workforce
          Mobile App
          Job Scenarios
          Scheduled Maintenance
          FSM × Desk
          FSM × Books & Invoice
          FSM × WhatsApp

          MCP Tool Guide MCP Changelog
              What's new
              Blogs
              Community
              Zia
              API resources
              Pricing
              Integrations
              Town Hall
              Custom Apps


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






                                    Zoho Developer Community



                                        Bootcamp
                                        Community
                                        Pricing
                                        Webinars
                                        What's New
                                        Integrations
                                        Contact Support
                                        Contact Sales
                                          Zoho Survey Resources
                                            Features
                                            Survey Templates
                                            Integrations
                                            Community
                                            iOS Mobile Surveys
                                            Pricing
                                            Android Mobile Surveys
                                            Insurvey Blogs
                                            Insight Blogs
                                            Tips & Tricks





                                                        Latest Feature Updates

                                                          • Desk Community Learning Series


                                                          • Digest


                                                          • Functions


                                                          • Meetups


                                                          • Kbase


                                                          • Resources


                                                          • Glossary


                                                          • Desk Marketplace


                                                          • MVP Corner


                                                          • Word of the Day


                                                          • Ask the Experts




                                                              Zoho SalesIQ Resources

                                                                    • Sticky Posts

                                                                    • Announcing the new SKILL.md for Zoho CRM and the updated OAS repository!

                                                                      We are introducing a new zoho-crm skill to make working with Zoho CRM Developer tools (like APIs, functions, widgets, client scripts, queries etc) easier and faster, with the help of AI in your preferred AI harness like Claude Code, Codex, Cursor, VSCode

                                                                    • Kaizen #256 - Build an Arrival Readiness Web Tab in Zoho CRM

                                                                      Hi everyone! Welcome back to the Kaizen series! In the post, we discuss a use case in hospitality industry: how an Arrival Readiness web tab widget can be used to let reception staff identify and resolve issues before arrival of guests. Use case In the

                                                                    • 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


                                                                    Manage your brands on social media
                                                                    Access Zoho Social

                                                                      Zoho Pagesense Resources


                                                                          Zoho TeamInbox Resources

                                                                            Zoho DataPrep Resources


                                                                              Zoho CRM Plus Resources

                                                                                Zoho Books Resources


                                                                                  Zoho Billing 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


                                                                                                              ご検討中の方