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! 😊

    • Sticky Posts

    • 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

    • Kaizen #152 - Client Script Support for the new Canvas Record Forms

      Hello everyone! Have you ever wanted to trigger actions on click of a canvas button, icon, or text mandatory forms in Create/Edit and Clone Pages? Have you ever wanted to control how elements behave on the new Canvas Record Forms? This can be achieved

    • Kaizen #142: How to Navigate to Another Page in Zoho CRM using Client Script

      Hello everyone! Welcome back to another exciting Kaizen post. In this post, let us see how you can you navigate to different Pages using Client Script. In this Kaizen post, Need to Navigate to different Pages Client Script ZDKs related to navigation A.

    • Recent Topics

    • Zoho CRM - Potentials Tab

      Hi! When I create a Deal (Potentials tab) the header looks like this: After a refresh on the page it looks like this: What should I do so that it is displayed like in the second pic without refresh? Also I have a user that as of recently, cannot see this

    • Unable to create embed code for resource of workdrive using API

      Hello Team, I am trying to create embed code for a resource using workdrive api in powershell, however facing some issues with injecting data in body. Followed Doc: https://workdrive.zoho.com/apidocs/v1/filefoldersharing/shareeveryone Please help, below

    • Feature Request - Insert URL Links in Folders

      I would love to see the ability to create simple URL links with titles in WorkDrive. or perhaps a WorkDrive extension to allow it. Example use case: A team is working on a project and there is project folder in WordDrive. The team uses LucidChart to create

    • not able to convert pdf to jpg and other forms and vice versa.

      i want to change my pdf to jpg, word, etc and some times jpg to pdf. i don't know how to do in this.

    • Enable / show scroll bar when Mega Menu is opened

      Hey there I am using the mega menu add-on and experience a "flicker" whenever the mega menu opens. The reason is, that the scrollbar, which has a width of a few pixels, stops showing when the mega menu opens. As the scrollbar disappears the whole page

    • Reports: Custom Search Function Fields

      Hi Zoho, Hope you'll add this into your roadmap. Issue: For the past 2yrs our global team been complaining and was brought to our attention recently that it's a time consuming process looking/scrolling down. Use-case: This form is a service report with

    • How can I transfer data from Production to Development environment?

      Hi, I am using Creator V6 and would like to bring all the data in production to the Development and Testing environments? Is there an easy way of doing that or I have to export and import each table?

    • New portal SAML authentication error: User not found

      Dears, Has anyone else been experiencing this lately? I am creating a new portal authenticated by SAML (Entra ID). I followed the same process as I did with other portals, but any new portal created after this always encounters this error. I’ve been reporting

    • Devis et facture multi page

      Bonjour, je suis sur Zoho invoice et je rencontre un problème sur mes devis et factures lorsqu'ils dépassent 1 page. je me retrouve souvent avec des lignes coupées ou le sous total page 1 et le total page 2. j'aimerai savoir s'il existe une possibilité

    • Help with Filtering Records, HTML Pages, and Automatic File Uploads in Zoho Creator

      Hi Zoho Creator Community, I’m building a Zoho Creator application and need guidance on a few features I’ve been struggling with. I want to implement them safely and efficiently, and I’d appreciate any examples, tips, or best practices. I want users to

    • Feature Suggestion for Zoho Websites – Inspired by Squarespace Systems

      Dear Zoho Team, I’m a Zoho user and also a Squarespace Platinum Circle member, and I recently noticed the launch of Zoho Websites in India. I wanted to share some ideas for features that could enhance the platform for professional users and agencies.

    • Custom View - Sort by Custom Field

      I created a custom field for our Engineering team to know which tickets to work first by numbering them.  I created a custom view to general data which includes the Engineering Priority.  However, I cannot sort the Engineering Priority column ascending

    • Zoho Indeed Intergation not pulling candidate details

      We have recently integrated zoho with indeed. Prior to this our candidates came into the candidates tab via the zoho.resumes email address from indeed and it pulled through the candidates mobile number, and majority of the time a postcode. However since

    • Custom View of tickets created today

      How can I create a custom view that list all my ticked created in the current date? Currently, if I select the "Created Time" criteria, the "Current Time" option does not work as today. Actually, I don't know how it works this "Current Time".

    • Lifecycle Reports

      From data to decisions: A deep dive into ticketing system reports A lifecycle report captures and visualises the sequential states that a ticket undergoes across its lifespan. For instance, when a customer submits a support ticket for a faulty product,

    • Zoho Forms - Print Button on Forms

      Hi Forms team, I'm replicating a form for a client which is currently based on JotForm. I noticed that at the end of the form there is a button to print the completed form. I thought this would be something worth sharing and a nice to have in Zoho Forms.

    • Putting Watermark on Zoho Sheet

      Can this be done?

    • Validation function not preventing candidates under 18 or over 30 from submitting the web form

      Hello everyone, I’m trying to create a validation rule for the Candidate Webform in Zoho Recruit. I added a custom field called “Date of Birth”, and I want to make sure that candidates cannot submit the form unless their age is between 18 and 30 years.

    • Report to know the history of certain Tickets on Desk

      Hi there guys, As the title implies we're wondering if there's any way to get some kind of Report that allows us to check the History of various Tickets at the same time since as of today if we want to know that we have to check them 1 by 1 which is not

    • Advanced Usage Billing: Prepaid with Drawdown

      Picture yourself at your favourite coffee shop, Bean & Brew. You come by every morning for your usual cappuccino, and occasionally you get an extra cold brew and a muffin or two in the afternoon. Interestingly, Bean & Brew has a new idea of offering a

    • Zoho Commerce in multiple languages

      When will you be able to offer Zoho Commerce in more languages? We sell in multiple markets and want to be able to offer a local version of our webshop. What does the roadmap look like?

    • Urgent Zoho Creator down!!!???

      Now my zoho creator faced this issue. Anyone has idea? Urgent!!!

    • The Social Wall: September 2025

      Hello everyone, As we step into the fall season, some major updates are on the horizon. Meanwhile, here are the exciting updates we rolled out this September. Approvals in iOS Managing approvals just got more seamless on mobile. With this update, the

    • Introducing Detailed View for Candidates in Vendor Portal

      We’ve added a new Details sub-tab inside the Vendor Portal to help vendors easily view complete candidate information after submission. With this update, vendors can now access all candidate details, from personal information to associated job openings,

    • Zoho One Down

      Zoho Team, Checking if when the services up - currently Zoho One is down

    • How can I track which zoho users are actively using Zoho CRM

      I have several licenses of Zoho CRM. We now need to add a new user. I could purchase a new license, but before I do, I would like to see if any of our existing users are not actively using the license assigned to them. How can I determine the activity

    • Access to Detail View From HTML Snippet

      Zoho Creator displays a detail view that slides out from the right onClick of a record in a report. Am I able to access that detail view from an html snippet, e.g. click a record in a list and display the detail view? The zc_LoadIn dialog is a bit clunky,

    • Billing Management: #10 Solving Common Mistakes in Billing

      Over the past few weeks, we have explored different facets of billing, from the simplicity of traditional one-time billing to the evolving landscape of subscriptions, retainers, and usage-based models. We've unpacked how billing isn't just about sending

    • 【開催間近 - 10/17】東京 ユーザー交流会 Vol.3 参加登録 受付中！(参加無料)

      ユーザーの皆さま、こんにちは。コミュニティチームの藤澤です。 10/17(金)に、東京・新橋で「東京 ユーザー交流会 Vol.3」を開催します！ ZOHOLICSよりも小規模なイベントですので、「リアル開催はちょっと緊張する…」という方も、安心してご参加いただけます✨ 当日は、初公開の事例を2つご紹介予定です！ なお、セッション映像のアーカイブ配信は予定していないため、会場にお越しいただいた方だけが、登壇者へ直接質問したり、リアルな声を聞いたりできる貴重な機会となっています。 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

    • Loading CSS Stylesheets into HTML Snippet

      Combining html/css into a single snippet can grow quite large for a UI that has a lot of functionality/styling. To keep things tidy, are we able to pull files into an html snippet using a <link> tag? If so, what are some best practices?

    • Notes Attachments

      Two things it would be nice to have the attachment size the same as the attachments sections and it would be nice to be able to attach links like you can in the attachments section. Thank you

    • Canvas: empty images

      Hello. If I add an image field like contact photo in a Canvas design, and the field is empty, there is an ugly placeholder in its place. This doesn't happen in the standard view. In the standard view, if the contact photo is empty, nothing appears in

    • Google enhanced conversions not working

      Hi guys, I've connected Zoho CRM through Google Ads interface with the goal to setup the enhanced conversion tracking in Google Ads. I have to Zoho related conversion goals which you can see in the images below: For the conversion goal above I've setup

    • Sync Contacts with iPhone

      Is syncing the Zoho Personal Mail contacts with the iPhone (or other mobile devices) in the works?  I just dumped Yahoo & then found out that contacts sync is missing.  Importing is only a stop gap and a step backwards for me.

    • MS Teams Meeting to Zoho CRM

      Has anyone figured out a good way to push MS Teams meeting info on a trigger of "meeting end" to Zoho CRM? We're looking for a way to take attendees of a meeting and meeting duration and push it into Zoho CRM after the meeting has ended. If I can just

    • How do I move a section or element from one page to another in the NEW Zoho Sites UI

      I have a section on my home page with numerous elements within it and I'd like to move the entire section to a different page on my site so I don't have to recreate it from scratch.  Is there a way for me to do that easily? I could use a quick answer on this please.

    • Zoho Projects app update: Global Web Tabs support

      Hello everyone! In the latest version(v3.10.10) of the Zoho Projects app update, we have brought in support for Global Web Tabs. You can now access the web tabs across all the projects from the Home module of the app. Please update the app to the latest

    • Export as MP4 or GIF

      Hi, Just wondering if there's a way to export/convert a presentation to an MP4 video file or even a GIF. One use case would be to use the animation functionality to create social media graphics/charts/gifs/videos. Thanks for a great tool... Rgds Jon

    • Page Layout- Horizontal Rule

      When editing the layout of, for instance, the Potentials page, is there a way to insert a horizontal rule or white space in between fields?  I'd like to keep a group of fields in the same Section, but would like to create some seperation in order to further group together certain fields within the Section.  If this is not possible, does anybody have any other suggestions on how to create this same effect?   Thank you!

    • Zoho Books will discontinue support for older browser versions soon

      Hello users, Starting from May 15, 2024, Zoho Books will no longer support the following browser versions: Browsers Version Restrictions Firefox Browser Versions older than 100 Google Chrome Versions older than 100 Microsoft Edge Versions older than 100

    • Next Page