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

    • Reporting tags for custom modules

      Hi, it could be very useful. At field level and at sub table level. Thanks, Eduardo

    • Can't pass Dates and use date filtered Charts in Pages?

      I don't mess with pages very much, but I'm trying to build a dashboard. I have a search element and several charts that need to be filtered. I also have a stateless form for a start/end date picker I am trying to use to filter data for the charts. Here

    • ZOHO FSM Trial - Assets

      Hi I am currently using Zoho CRM and looking at adding FSM. I am trialing FSM at the moment, to potentially move away from my current programme (SimPro) but have a query on the Asset system within FSM It looks like you can only create 1 asset "type";

    • Customize User Invites with Invitation Templates

      Invitation Templates help streamline the invitation process by allowing users to create customized email formats instead of sending a one-size-fits-all email. Different invitation templates can be created for portal users and client users to align with

    • Sending Email with Attachment (PDF, Excel file)

      Hi, I'm new to Zoho CRM and I'm setting up a flow to send an Email with Attachment when user reaching a certain stage of a Deal. In detail, I've created a Blueprint which requires user to attach a PDF file when reaching a certain point of the stage and

    • Based on the Assign To time task want to trigger also reminder for the task still move form fresh lead

      If the leads is assigned To 1 am to 10.55 am task want to create 11am Then reminder want to go the person at 4pm If lead status not moved from fresh lead. From next on wards Reminder want to go 11 Am and 4pm Every day still the person moved to fresh lead

    • Emails Not Sending

      This has happened before. I contacted Zoho and it seemed to work, but now my emails are not sending or taking a long time to send and half the time attachments don't attach. It just keeps saying Sending... and I have to keep clicking it to make it send.

    • [Free Webinar] Learning Table Series - AI-Enhanced Logistics Management in Zoho Creator

      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

    • WhatsApp pricing changes: Pay per message starting July 1, 2025

      Starting July 1, 2025, WhatsApp is shifting from conversation-based pricing to per-message billing. That means every business-initiated message you send will count. Not just the first one in a 24-hour window. Pricing updates on the WhatsApp Business Platform

    • Create a button that converts Sales Order into a Custom Module

      I am looking for a way of creating a button on Sales Orders that would automatically create a record in a custom module I have created called Contracts. The custom destination module "Contracts"  has the following fields that I would need to populate [Contracts Name] populate with SalesOrderID [Account Name] populate with related Account Name [Contract Start Date] populate with the date that the record was created Could someone help or point me in the right direction? Thanks

    • Remove all of the junk data that comes with the trial

      How would I go about removing all of the junk data that comes with the trial of zoho crm?

    • Video Interview Feature

      Please add a text option as well while sending invitations to candidates for video interviews, candidates are missing out on the email. They are more convenient in text and it really helps Hope you would understand, thanks

    • Singapore DBS Bank

      Is there any schedule corresponding to DBS of Singapore? 

    • Including Contact and Account Information in Zoho Projects.

      In Zoho Projects I have created a custom layout which already includes a 'Client Information' section. The 'Client Information' section already includes integrated fields (integrated with CRM) for various account and contact details. Here's what I want

    • Unable to Download CRM Contact Data: WorkDrive Integration Issues

      ## Problem Description We need to let users download contact information from CRM as CSV files to their local computers. Since we couldn't implement a direct download option, we're trying to use WorkDrive as a workaround - but we're encountering issues

    • App Spotlight : PagerDuty for Zoho Cliq

      App Spotlight brings you hand-picked apps to enhance the power of your Zoho apps and tools. Visit the Zoho Marketplace to explore all of our apps, integrations, and extensions. In today's fast-paced world, seizing every moment is essential for operational

    • Campaigns going to spam folder, how to build so that it goes to inbox

      Hello, New to campaigns, now have it functioning correctly. In my test group of 10 email addresses 100% of the emails went to spam/junk folder and/or were blocked/captured by spam filters. What is the process to building a message or format that does

    • Integrate QuickBooks with Bigin and streamline your sales and accounting!

      If your business relies on Bigin for customer management and QuickBooks for accounting and invoicing, this new integration is here to make your operations more efficient. By connecting these two platforms, you can now manage your CRM and financial processes

    • When a ticket is merged, the merged ticket's link should redirect to the remaining ticket.

      Zoho Desk deletes merged tickets. Which is not ideal. The issue is if you have a link bookmarked, or even in your inbox from a ticket that was merged, when you visit you receive an error because merging tickets actually deletes the ticket that was merged.

    • Pass data from a Zoho Desk ticket to a Zoho Form as pre-fill data?

      Hello, I'm trying to pre-fill a Zoho form with client data based on the Zoho Desk ticket data that would be associated. Work flow i'm trying to create: 1. Ticket created for a sales order 2. order requires a site survey 3. link inside ticket links to

    • Goods total weight in Sales Orders

      Hello everyone, We want to automatically calculate the total weight in Sales Orders based on the weight data specified in the Items. Could you please suggest the simplest way to achieve this in Zoho Inventory? I would greatly appreciate any advice and

    • Problem with pagination in Zoho Inventory API

      Hello, I'm having an issue with the  Zoho Inventory API when I try to use the pagination. When I send a request to https://inventory.zoho.com/api/v1/items?authtoken=XXXXXXXXXX&organization_id=YYYYYY&page=1&per_page=50, I get back 200 items. And when I send the same request for the second page, https://inventory.zoho.com/api/v1/items?authtoken=XXXXXXXXXX&organization_id=YYYYYY&page=2&per_page=50 I'm getting back the same 200 items I get with the first request.  So I think neither the page parameter

    • Can a user be assigned to an Account based on email domain?

      Hi ZohoDesk, If I have a customer Account already configured is there any way I can use a domain matching rule to assign a new user to the correct account when logging a ticket by email? Many thanks Rich

    • Can't track conversions using GTM

      We had to move the installation of the SalesIQ widget from GTM to directly do it in our wordpress site. The SalesIQ widget was being blocked by Adblockers which caused a lot of our visitors to not be able to see it. This issue was fixed from deleting

    • WhatsApp Message Pricing Changes (Effective July 1, 2025)

      Starting July 1, 2025, Meta will introduce a per-message pricing model on the WhatsApp Business Platform, replacing the current conversation-based billing. This update affects all WhatsApp messages sent through Zoho Marketing Automation. We’ve broken

    • Parent-Child Tickets using API or Deluge

      Hi Everyone, We are looking at the parent-child ticketing features in Zoho Desk. We want to be able to create a parent ticket at customer level and nest child tickets underneath. The issue we are facing is to be able to automate this. I'm checking the

    • Blueprint transitions on locked records

      We use the ability to automatically lock records (quotes, sales orders, etc.) based on criteria, such as stage. For instance, if a quote has been sent to a client, the quote is then locked for further edits. Our ideal quote stage process is: Draft>Sent>Won.

    • CC from mail client to Zoho CRM

      Hi,  Is it possible to have emails sent outside of CRM use a CC that sends them into the CRM and attaches to the record?  Thanks

    • Department e-mail signatures

      Hello everyone, We're just in the process of evaluating various help desk software alternatives and Zoho is looking pretty good to us at the moment. Our set up is a bit strange and I was wondering if this is possible. We have one tech who looks after

    • How can I hide "My Requests" and "Marketplace" icon from the side menu

      Hello everybody, We recently started using the new Zoho CRM for Everyone. How can I hide "My Requests" and "Marketplace" from the side menu? We don't use these features at the moment, and I couldn't find a way to disable or remove them. Best regards,

    • WhatsApp Calling Integration via Zoho Desk

      Dear Zoho Desk Team, I would like to request a feature that allows users to call WhatsApp numbers directly via Zoho Desk. This integration would enable sending and receiving calls to and from WhatsApp numbers over the internet, without the need for traditional

    • Sites Speed and Performance Grades

      I noticed that there are no recent inquiries or complaints about load speed or performance issues with Zoho Sites websites. However, I wanted to understand what Zoho has done to ensure that speed remains optimized, images are compressed and lazy loaded,

    • Include Audio in Zoho Assist Session Recordings

      Hello Zoho Assist Team, We hope you're doing well. We’d like to formally submit a feature request regarding session recordings in Zoho Assist. 🎯 Current Limitation When conducting a Zoho Assist session that includes voice and/or video chatting, the recording

    • Unable to update Created Date/Time even via upsert

      hi all --- running a demo version and "recreating" some data from hubspot. I had tried the method to automatically move data over but it missed A TON of fields and some stuff wouldn't even map correctly so i am simply creating new Deal records to test

    • Blockchain Feature?

      Since I'm not an expert in this technology, is there any reason why you would not want to add this option to your Zoho SIgn documents? Is there a downside?

    • Kaizen #196 - Zoho CRM Queries - Best Practices

      Nearing 200th Kaizen Post – We want to hear from you! 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. Got

    • Best way to account for shipping charges to customer

      I have been allocating all our shipping expenses to the "postage" account, but I realise that is probably incorrect, as for the most part, we pass on shipping charges to our customers. So I should probably add the shipping charges into the "shipping charges"

    • Zoho Flow s’enrichit avec les subflows et les actions Webhook

      Nous sommes ravis d’annoncer deux ajouts importantsà Zoho Flow : les subflows et les webhooks sortants. Ces nouvelles fonctionnalités ont été conçues pour vous aider à créer des workflows plus facilement et à automatiser davantage de tâches répétitives.

    • How to assign canvas view for portal user

      Hi , as a portal user, I can switch to another canvas view, however, I cannot find any field to configure a default canvas view for portal user. May I ask how to set it up in CRM? And if I can view list by sheet view as a portal user?

    • Restrict Leave Application Based on Attendance Cycle (24th to 23rd)

      Hi Zoho Team, Our organization follows a custom attendance cycle from 24th of the current month to 23rd of the next month. I would like to configure the system so that: Employees should not be able to apply backdated leave for any date after the attendance

    • Next Page