Kaizen #187 - Building a Timer and Worklog Widget (Part 1)

Kaizen #187 - Building a Timer and Worklog Widget (Part 1)



Howdy Tech Wizards!

Welcome back to a fresh week of Kaizen! 

This time, we are diving into a two-part series where you will learn how to build a Timer and Worklog Widget for Zoho CRM. This widget helps track active work time and log multitasking sessions using Zoho CRM APIs, Client Script, Functions, and Workflows.

Why It Matters?

Zoho CRM effectively captures stage/status transitions, like tracking when a case moves from Open to In Progress or On Hold. However, in dynamic work environments, employees juggle multiple work items and engage in impromptu tasks or conversations. 

Let’s take the On Hold status as an example. 

While it can be used to indicate pauses in progress, it does not always align with real-world workflows. Consider these scenarios:

Not all interruptions justify a status change 

Moving the case to On Hold for every minor detour (to clarify something with a colleague or respond to another emergency work item) would be impractical and could lead to under reporting actual work hours. Over time, this untracked effort adds up, creating a gap in visibility.

Frequent status changes may dilute their meaning 

In many teams, On Hold signifies a legitimate blocker like waiting on customer input or an external dependency. Using it frequently to reflect quick shifts in attention could compromise that clarity. 

A timer widget solves this by:
  • Capturing hands-on work items.
  • Logging context switches (unrelated tasks) with descriptive entries.
  • Feeding structured entries into a custom module for reporting and subform sync.

Business Scenario: IT Service Desk & Ticket Resolution

A tech support team uses the Cases module to resolve customer issues. Some tickets are straightforward; others require follow-ups, escalations, or cross-team coordination. While CRM timestamps (like stage transitions or picklist tracking) track when changes happen, they do not reflect how long someone actively worked on a case.

This Timer Widget can be the ultimate solution to track down the active time spent on each case through out the day.

What are we Building?

By the end of this two-part guide, you will know how to:
  • Build a timer widget to track time per task or any CRM record.
  • Log work sessions into a custom module every time the timer is started/stopped.
  • Automatically populate a subform in the corresponding record module using workflows and Deluge functions.
  • Leverage the Reports module to analyze work patterns, SLA adherence, and productivity trends.
 In Part I, we will focus on:
-> Building and configuring the Timer Widget.
-> Capturing each timed session as a record in a custom module.

Prerequisites

1. Create a Custom Module

Create a custom module named Timer Entries to log work details and generate reports from the Reports module. A new record will be added to this module each time a timer is started.

Set up the following custom fields in the Timer Entries module:

Custom Fields
Data Type
Start Time
DateTime
End Time
DateTime
Total Duration (in mins.)
Formula 
DateBetween(${Timer Entries.Start Time},${Timer Entries.End Time},'Minutes')
Related to Case
Lookup to Cases module
Work Description
Multi Line


2. Add a custom picklist option

Add a custom picklist option called In Progress to the Status picklist field in the Cases module for precisely identifying the status of the cases. 

Follow this Add/Remove Picklist Values help section for more details. 

3. Setup Custom Views for Contextual Filtering

To streamline the widget experience and ensure users only see relevant records to associate while tracking time, set up two smart custom views—one in the Cases module and another in the Timer Entries module. 

Active Cases View (Cases Module)

Create a custom view in the Cases module to list only the active tickets the logged-in user is working on. Use the following criteria tips:
  • Use the Status field to filter records with values like In Progress, On Hold, or Escalated.
  • Use the Case Owner field to show records that are assigned only to the currently logged-in user.
This view powers the drop-down inside the widget where users select the case they want to start the timer for.
Active Timers View (Timer Entries Module)

Set up a second custom view in the Timer Entries module to track entries where the timer has been started but not yet stopped. These represent active timers. Use the following logic for criteria:
  • The End Time field is empty (i.e., timer still running).
  • Timer Entry owner field matches the logged-in user.
This view is used internally by the widget to detect if a timer is already running and update the same entry once the timer is stopped.
Follow the Managing List View help page and use the specifications shown in the following image.

Building the Timer Widget 

Step -1: Review Basics

Refer to our earlier Kaizen on CLI Installation, Creating a Widget Project, and Internal hosting of the same.

Step 2 - Develop the Widget

After initializing your widget project using CLI, implement the timer logic:

Fetching Active Cases

On page load, the populateRecordsDropdown function initiates a Get Records API call to the Cases module, using the Active Cases custom view ID. This fetches all active case records assigned to the logged-in user. 

These records are then listed in a dropdown, allowing users to quickly select the relevant case they are about to work on.

async function populateRecordsDropdown() {
            const recordsDropdown = document.getElementById("moduleRecords");
            recordsDropdown.innerHTML = ""; 

            try {
                const recordsResponse = await ZOHO.CRM.API.getAllRecords({
                    Entity: casesModule,
                    cvid: casesCVID,
                    per_page: 10
                });

                if (recordsResponse.data && recordsResponse.data.length > 0) {
                    recordsResponse.data.forEach(record => {
                        const option = document.createElement("option");
                        option.value = record.id;
                        option.textContent = record.Subject || "Unnamed Record"; 
                        recordsDropdown.appendChild(option);
                    });
                } else {
                    const placeholderOption = document.createElement("option");
                    placeholderOption.value = "";
                    placeholderOption.textContent = "No records found";
                    placeholderOption.disabled = true;
                    placeholderOption.selected = true;
                    recordsDropdown.appendChild(placeholderOption);
                }
            } catch (error) {
                console.error("Error fetching records:", error);
            }
        }

Starting the Timer and Creating an Entry

Once the user starts the timer, The createRecord function triggers a Create Record API call to log the session in the Timer Entries custom module. The record captures the start time and the related case and description (if provided).

Even if no details are entered or case is selected, a timer entry is still created with the start time. This ensures that spontaneous work sessions are tracked and not lost.

async function createRecord(startTime) {
            try {
                const workDescription = document.getElementById("workDescription").value;
                const selectedRecordId = document.getElementById("moduleRecords").value;
                const selectedRecordText = document.getElementById("moduleRecords").options[
                    document.getElementById("moduleRecords").selectedIndex
                ].text;

                const data = {
                    Start_Time: startTime,
                    Owner: currentUserId,
                    Work_Description: workDescription,
                    Related_to_Case: selectedRecordId, 
                    Name: selectedRecordText 
                };

                const response = await ZOHO.CRM.API.insertRecord({
                    Entity: timerModule,
                    APIData: data
                });

                console.log("Start time recorded successfully");
            } catch (error) {
                console.error("Error creating record:", error);
            }
        }


Stopping the Timer and Updating the Entry

When the timer is stopped, the widget uses the Active Timer Entry custom view to locate the most recent Timer Entry record created by the logged-in user that does not have an end time. 

The updateRecord is then triggered to update that active entry using the Update Record API call. It updates the End time of the session and the related case, descriptions, if it was not already provided when the timer was started.

async function updateRecord(endTime) {
            try {
                const workDescription = document.getElementById("workDescription").value;
                const selectedRecordId = document.getElementById("moduleRecords").value;

                const response = await ZOHO.CRM.API.getAllRecords({
                    Entity: timerModule,
                    cvid: timerEntriesCVID,
                    per_page: 1
                });

                const latestRecord = response.data[0];
                if (latestRecord) {
                    const recordId = latestRecord.id;
                    const data = {
                        id: recordId,
                        End_Time: endTime,
                        Work_Description: workDescription,
                        Related_to_Case: selectedRecordId 
                    };

                    await ZOHO.CRM.API.updateRecord({
                        Entity: timerModule,
                        APIData: data,
                        RecordID: recordId
                    });
                    console.log("End time updated successfully");
                }
            } catch (error) {
                console.error("Error updating record:", error);
            }
        }

Step 3 - Validate and Pack the Widget

  • Follow the steps given in the Widget help page to validate and package the widget.
  • Go to Zoho CRM > Setup > Developer Hub > Widgets and click Create New Widget.
  • Fill in the required details as shown in this image and ensure to select Button as the widget type.

Step 4 - Associate it with Flyout

  • Go to Setup > Developer Space > Client Script. Click New Script.
  • Enter a name and description for the script. Choose Command type in Category

  • Create a Flyout and render a widget within it using its details like the API name of the widget, title, size, and animation type. You can get the Widget API name from the widget's detail page. 
let allowedUserEmails = [];
allowedUserEmails.push('user1_email_address');
allowedUserEmails.push('user2_email_address');
allowedUserEmails.push('user3_email_address');
let currentUserEmail = $Crm.user.email;
if (allowedUserEmails.indexOf(currentUserEmail) == -1) {
    ZDK.Client.showMessage('Command access resticted', { type: 'error' });
    return false;
}
ZDK.Client.createFlyout('myFlyout', {header: 'Timer', animation_type: 4, height: '600px', width: '500px', top: '10px', left: '10px', bottom: '10px', right: '10px' });
ZDK.Client.getFlyout('myFlyout').open({ api_name: 'Timer', type: 'widget' });
return true;

Refer to Creating a Client Script help page for more details. 

Try It Out!

A complete working code sample of this widget is attached to this post.

Now, let us see how this Timer widget works:

1. Start the Timer 

Open the widget and select an active case from the dropdown. As soon as you start the timer, a new record will be automatically created in the Timer Entries module to capture the session.

2. Stop the Timer 

When the task is complete, provide a description of the work you have done and stop the timer. The same Timer Entry record (created when the timer was started) will be updated automatically with the end time and your work description.

This forms the foundation for accurate time tracking at the record level. 

In Part 2, we will show how to:

-> Use a workflow and Deluge function to transfer these entries into the Work Log subform inside the relevant Cases record.
-> Use CRM Reports to slice and dice work time for better SLA and productivity insights.

In the meantime, would you like us to address any of your pain-points or have a topic to discuss? Let us know in the comments or reach out to us via support@zohocrm.com.

Until next time, Happy Coding! 

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

Related Reading

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

Idea
Previous Kaizen: Client Script Support for Subforms | Kaizen Collection: Directory


    • Recent Topics

    • Des parcours WhatsApp simples pour engager vos prospects et les convertir durablement

      En tant que professionnel du marketing, il vous est sûrement arrivé de déployer des campagnes par e-mail, SMS, réseaux sociaux ou pop-ups, sans obtenir l'engagement espéré. Une situation frustrante, mais malheureusement fréquente. Vous vous posez sans
    • [Free Webinar] Learning Table Series - Smart Visitor Management with Zoho Creator—Built for Every Industry

      Hello Everyone! We’re excited to invite you to another edition of Learning Table Series, where we showcase how Zoho Creator empowers industries with innovative and automated solutions. About Learning Table Series Learning Table Series is a free, 45-60
    • Query about error on flutter build for android

      I am having this error when building flutter for android. https://pub.dev/packages/apptics_flutter i followed the instructions here, modified to work on gradle version 8
    • 【参加無料】6月ユーザー交流会 参加登録 受付開始(東名阪の3都市開催)

      ユーザーの皆さま、こんにちは。コミュニティチームの藤澤です。 6月に東京 / 大阪 / 名古屋の3都市でユーザー交流会を開催します! 各地域のユーザーによるZoho 活用事例や、自社活用・運用について参加者同士で情報交換が出来るグループワークなどを予定しています。 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー ※以下、記載順で開催予定 🟠 大阪ユーザー交流会 6/5(木) 18:00-20:20 ・会場:APイノゲート大阪 ・予定セッション ┗Zoho サービス活用事例:Zoho
    • Zoho Books Payroll

      How am I supposed to do payroll and pay my employees with Zoho Books? I think it's pretty strange that an accounting software doesn't have the ability to perform one of the most common functions in business; paying your employees. Am I missing something,
    • Zoho Finance Workshop 2025 is Happening Now!

      Hello everyone! 👋 We’re thrilled to announce that the Zoho Finance Workshop 2025 has officially started, and we've already wrapped up the event in Chennai, our home ground! After an amazing session, we're geared up to visit more cities in India and take
    • DORA compliance

      For DORA (Digital Operational Resilience Act) compliance, I’ll want to check if Zoho provides specific features or policies aligned with DORA requirements, particularly for managing ICT risk, incident reporting, and ensuring operational resilience in
    • DKIM cannot be enabled for the domain as no verified default selector present

      Can't get the DKIM working. May you please check my account (nksy.us) to see what's wrong?
    • Will Cliq support Streaming for AI / LLP resposne

      Currently LLM APIs stream the LLM response token by token, since waiting for the entire response takes usually ~ 7-10 seconds. Is there any intention in supporting streaming in the Cliq platform? Namely, I'd like to build a chatbot in Cliq and I want
    • Email address with + char is incorrectly invalid

      cannot enter contact with email address containing +, i. e. valid+email@example.com. this is a perfectly valid email address by but fails Zoho Campaigns validation. https://en.wikipedia.org/wiki/Email_address#Local-part
    • Amount Change -> Reason of update

      How can I setup the CRM so whenever the Amount field is being changed, the user who changes it needs to fill in a reason of change -> Could be a Subform entry or even a note. I'm happy to use any of available features -> Workflows, Functions, Buttons,
    • Zoho not receiving verification email.

      I developed a website registration page and need to send verification email. I am using sendinblue for sending out the verification emails. Somehow, the mail is not being received by the Zoho users. Gmail, outlook, yahoo domains works fine but when I try to send the mail to my Zoho account I am not able to receive the mail. Can you please let me know what might be the issue?
    • How to Save Token in CRM

      Hi, Is there any method that allow user save their token in CRM, otherwise I have to get token every time the function run.(Token expire each day)
    • Any simple way to setup an automation from Facebook Lead Forms to Zobot taking care of the conversation?

      Right now i have a simple setup live with Make.com sending a Whatsapp template message from Twilio to a Lead received from Facebook Lead form then a ChatGPT bot taking care of the conversation. But no CRM On SalesIQ i can't find a way to start a conversation
    • Automation#22 Track Ticket Duration at Specific Status

      Hello Everyone! Welcome back to the Community Learning Series! Today, we explore how Zylker Techfix, a gadget servicing firm, boosted productivity by tracking the time spent at a particular ticket status in Zoho Desk. Zylker Techfix customized Zoho Desk’s
    • Cliq 1.7.5 status icon doesn't update if there are unread messages

      Cliq 1.7.5 System: Ubuntu 24.04.2 LTS x86_64 Installed from the .deb package (cliq_1.7.5_amd64.deb / MD5: 10c5924911a2e90af012d564da670bf8) GNOME 46 Whenever I get new messages the status/notification icon remains unchanged (white icon without the red
    • Is there a way to customize the style of the success message - Advanced Web Form

      Is there a way to customize how the success message is displayed after a Zoho webform is submitted? We’d like the success confirmation to match the visual style and branding of our website, so we're looking for options to either apply our own CSS or replace
    • Zoho Desk app update - Initiate WhatsApp chat with pre-approved templates from ticket and contact details screen

      Hello, everyone! We are excited to introduce an option to send WhatsApp messages via IM(Instant Messages) using pre-approved templates directly from the ticket and contact details screen of the Zoho Desk app. In the ticket details screen, we have enhanced
    • Where to view user feedback on answer bot's "was this helpful?"

      We are trialing answer bot in our knowledge base and like what we see so far. One of the things we like is that upon answering a query, answer bot asks "Was this helpful?" (see attached). As part of our trial we've been responding to this by clicking
    • Is there a way to have a "Time only" field?

      I need a field that only captures the time.  I don't like the Date-Time field.  It is very clumsy for the user to input AND I need to sort by time separately.  PLEASE add a new field that is dedicated only for inputting time.  I don't need seconds just hours and minutes.  Bonus would be to change it from AM/PM to military/international time. What do we need to do to make this a separate field???   I don't want a work-around, I just need the field.  Is there someone out there that knows how to create
    • CRM Mail Merge Template copies OLDER version of the document instead of most recent version

      I have to make 60+ Mail merge templates in ZOHO CRM to use for editing in WRITER and then sending on to sign for signatures. So I have been working on 1, setting all the styling and automatisation right, and I want to use this one as a master template
    • Zoho Sprints Mobile 2.0 : La gestion de projet, réinventée pour vos déplacements

      Nous avons le plaisir de vous annoncer la sortie de Zoho Sprints Mobile 2.0 : une version revisitée de notre application, avec une interface modernisée, de nouvelles fonctionnalités puissantes et une navigation optimisée. Grâce à cette mise à jour, gérer
    • Allow Portal Users to log in using their mobile number.

      I want to allow portal users to log in using their mobile number. I referred to below documentation, but it mentions that this is only supported for Indian mobile numbers. Is it possible to enable login using a Singapore mobile number? https://help.
    • Zoho Webinar Android app update - Organizer chat

      Hello everyone! In the latest version(v1.4.0) of the Zoho Webinar app update, we have brought in support for the 'Organizers' chat feature. In addition to the existing public chat, co-organizers now have access to chat separately with organizers and attendees,
    • Task Due Time - Unable to Add

      I have taken a trial version to test, I could not find “Due Time” feature. Only Due date is given
    • Sign - Introduce a feature to make fields required based on conditions

      Add "Required" to conditional options for fields. Example: A Sign document contains 2 fields Company Type (picklist) Company Registration Number When "Limited Company" is selected from the Company Type, the Company Registration Number should become
    • Connect Zoho Creator on on prem database with databridge.

      Hi im new to zoho creator. Been through many forums and training clips but cant find a solution. 1. I have an on prem mssql server called "Sales" with a tabel called "Monthly" the server address is 10.0.0.10 2.i have Databridge installed on the server
    • Add a URL to a note

      I enter a lot of notes onto Account and Contact records. For example, I would like to add a note to a person with a link to their blog. When I paste the link into the note, it pastes ok, but it's not a "clickable" link. Is there a way to maintain the
    • Zoho webinar iOS app update: Introducing a dark theme, organizer's chat, emoji reactions, recording consent, and live answer on questions list.

      Hello everyone! In the latest version(v1.1) of the Zoho Webinar app, we have brought in support for the following features: Dark theme. Organizer's chat. Emoji reactions. Recording consent prompt for attendees. Live answer on questions list. 1. Dark theme:
    • Unveiling the next iteration of Ask Zia in Zoho CRM: An all-new chat interface, conversation history, actions, and much more

      Your CRM assistant just leveled up. Zoho CRM's Ask Zia functionality now offers a more conversational and context-aware experience to help you not just understand your data, but act on it—all from one chat window. With its redesigned interface and expanded
    • Field of Lookup in CRM

      Last modified on 04/04/2023: Field of lookup is now available for all Zoho CRM users in all DCs. Note that it was an early access feature available only upon request. Hello All, We're thrilled to talk about a much-awaited enhancement to lookup fields—now
    • [Free webinar series] Get to know Deluge: Zoho’s powerful scripting language

      Hello Everyone, We are much elated to invite you all to our upcoming session in Zoho Deluge! Bringing on to your table - Get to know Deluge: Zoho’s powerful scripting language Understanding Deluge Zoho’s suite of applications offers robust solutions for
    • Integrate with WooCommerce using Wordpress Plugin

      We’re thrilled to announce a powerful update to the Zoho Marketing Automation WordPress plugin with WooCommerce integration! This enhancement enables new possibilities for businesses running online stores using WooCommerce, empowering them to merge seamless
    • Can't find field from ZCRM for a trigger

      Hello, Currently I am revamping our CRM system and we have created second layouts from to try out new processes while not disrupting the old one. Moreover, we want to use different layouts for different processes. The issue is that when creating the ZCRM
    • How do I add an all ready created module, to an page

      So I have created a list of equipment in a module and want to add it to some of the customer accounts, but not all of them, how do I do this? Thanks :)
    • Integrate Zoho CRM and Zoho Workdrive

      I am having some trouble with my workdrive connection in zoho crm. What I want to do is this: 1) Create a folder for each account record in workdrive team folder, name it after the account name field 2) For each upload to a record in the deals module,
    • 5名限定 課題解決型ワークショップイベント Zoho ワークアウト開催のお知らせ(5/28)

      ユーザーの皆さま、こんにちは。Zoho ユーザーコミュニティチームの藤澤です。 5月開催のZoho ワークアウトについてお知らせします。 今回はZoomにてオンライン開催します。 ▷▷登録はこちら:https://us02web.zoom.us/meeting/register/l6xddhOoR--8rroMIgKWyA ━━━━━━━━━━━━━━━━━━━━━━━━ Zoho ワークアウトとは? Zoho ユーザー同士で交流しながら、サービスに関する疑問や不明点の解消を目的とした「Zoho
    • Zoho people - holidays apear on zoho calender?

      holidays that are stored within zoho people holidays can they be subscribed to within zoho calender?
    • Contact and Deal details in Company Module

      Hello, We would like to set up Zoho CRM based on Account/Company centric approach. We are using several Templates for each company in the Group. And the Account/Company module shall be available to all Templates. The Account/Company module will have all
    • Anone know how to add email body text in Button Properties ?

      When adding a button there is an option use a "Link to Email Address" which triggers an email addresses to the To: email and with the Subject as per the Subject field. I want to add some text in the body of the email, such as My contact details are: Name:
    • Next Page