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


    • Sticky Posts

    • Kaizen #197: Frequently Asked Questions on GraphQL APIs

      🎊 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.
    • 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.
    • Celebrating 200 posts of Kaizen! Share your ideas for the milestone post

      Hello Developers, We launched the Kaizen series in 2019 to share helpful content to support your Zoho CRM development journey. Staying true to its spirit—Kaizen Series: Continuous Improvement for Developer Experience—we've shared everything from FAQs
    • Kaizen #193: Creating different fields in Zoho CRM through API

      🎊 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.
    • Client Script | Update - Introducing Commands in Client Script!

      Have you ever wished you could trigger Client Script from contexts other than just the supported pages and events? Have you ever wanted to leverage the advantage of Client Script at your finger tip? Discover the power of Client Script - Commands! Commands
    • Recent Topics

    • Zoho Mail Search Engine Sucks

      Hello There! I really like all the features of Zoho Mail and I believe is way better than Gmail except for the Search Function. I believe Zoho Mail has a very poor search function, if you misspelled a word in the search box, Zoho Mail won't display any
    • Allow Subtasks and Task Lists to have their own Layout

      I'd like to have the ability for subtasks and task lists to have their own layout.  A subtask for us doesn't require all the fields that a parent task has.  The subtask seems cluttered with all the extra fields. Within a project Task List had different purposes.  I'd like the task layout to be different for some task lists.
    • How to update Customers in Zoho Books through Zoho Flow?

      Updating customers in Zoho Flow using a "update customer" action is deleting contact persons in Zoho Books.
    • Conect chat of salesiq with zoho cliq

      Is there any way to answer from zoho cliq  the chat of salesiq initiated by customers?
    • How to transfer credit between customers?

      Hi All, We have a slightly odd situation. It happens that we have two separate customers that are related to each other personally. One customer has an amount of credit, and would like to use that credit to pay the *other* customers invoice. How would
    • Zoho Books Reports: Basic report with total items sold and Cost of goods sold

      How can books show a report with Item Name || Qty Sold || Total Revenue || Total Cost of Goods Sold || Margin I need to factor in also invoices that have been credited where customers returned good. This seems like such a basic report, I'm sure I'm missing
    • The amount entered is more than the balance due for the selected bills."

      Hi Team i am trying to record payments for vendors using API and getting this error in response as { "code": 28011, "message": "The amount entered is more than the balance due for the selected bills." } JSON is prepared according to Documentation and
    • VBA handling named ranges

      In VBA I'm able to work with a single cell named range. E.g. Set Jr = Range ("Year").Value. Also other options are working fine, like Range("Year").Address shows $L$3. However a named range refering to multiple cells is not working for me. Eg. tbl_Test
    • Kaizen #176 - Optimizing the Use of Record ID Variables in Zoho CRM Queries

      Hello everyone! Welcome to another week of Kaizen! Since the release of Queries, we have covered Handling Query Variables in Zoho CRM, Serialization and Schema Management, and Leveraging the 'crmAPIResponse' object in Queries in previous posts. Today,
    • Unbilled Items Report?

      Hello! Is there any way to display a list of items that remain unbilled, without creating an invoice for each customer to see if the unbilled items box is displayed? ;-) Ben
    • Consolidation of Multi currency

      Would like to discuss on the possibility of consolidating the ZOHO companies
    • Landed Cost Allocation / Custom Duty manual data entry

      My client is an import business. They must manually enter the duty for each item with landed cost allocation in Bill. This is because customs duties cannot be allocated based on Quantity, Value, Weight, and Dimensions. Manual data entry is highly time-consuming
    • Territories Just Don't Work

      I have been on chat and screenshare support for the past 3 days and am getting no resolution so hopefully, someone here can help me. I am the Super Admin of my organization. We publish books globally. I want to break down the books into territories so
    • Negative Opening Balance

      How can I add Negative Opening balance - meaning a credit balance to a Customer or a debit balance to a vendor? If I go thru Sales-->Customers, and if the opening balance is Rs. 1000 (credit balance), it does not allow me to enter a "minus" sign or mention
    • Single-Line Invoicing from Sales Order Despite Multiple SKUs Shipped

      We deal mostly with Government Tenders And Lets say we got a tender that needs 125 XYZ Laptops Then we found 95 Laptops with a different SKUs and 30 Laptops with different SKUs We talk with the IT department of the government company and they approve
    • 📣📣 Zoho Bookings Schedulathon 2025 is here!

      Hey Zoho Bookings fam, We're excited to invite you to our first-ever hackathon: Yes, Zoho Bookings Schedulathon 2025 is live now. This is a virtual event and you can participate anywhere from the world. Businesses should be able to set up meetings from
    • I want to send out a new newsletter each month

      Without rebuilding a whole journey is there a way to create a new newsletter that is sent to an existing journey monthly?
    • Reinstalling Workdrive Truesync client

      Hi, I attempted to update to the beta version of TrueSync, but it was unstable and kept crashing, so I need to revert to the stable version. How do I properly reinstall TrueSync on a Windows PC? I couldn't install the 3.15.x version directly over the
    • Evaluating Creator; yesterday fine; today connection times out

      Yesterday I spent hours creating a new app, and it worked fine. Today I cannot access creator.zoho.com. Is this common? I'm in the evaluation mode, but I'm thinking I'm going to keep looking. It worked from my home computer, and now I'm checking it from my work computer. My work computer always works just fine, so I shouldn't htink there would be special settings or anything. If there are, how to find out what they could be? Using Chrome on Windows XP The error I get is: The webpage at https://creator.zoho.com
    • Pivot Chart seems to show "old" data - how do I make it update?

      I wonder how to make a Pivot Chart "update" its data contents. Here is the background: I need to report a subset of data that is so complicated that it is easier to make a calculation and put the result in a "reporting form", and then display the data from that form.  So, I get data from the "original form" GRANTS, make some calculations and put the result in the "reporting form" PERIOD.  Now I can watch the result in a list called LIST, which works fine. The list LIST shows that form PERIOD contains
    • Upcoming Changes to LinkedIn Parsing in Resume Extractor

      Starting 31 July 2025, the Zoho Recruit Resume Extractor will no longer support direct parsing of candidate data from LinkedIn profiles. Why Is This Change Needed? In accordance with LinkedIn’s platform policies, extracting profile data through browser
    • how to create view in leads module to that will show all leads + converted leads?

      is it possible to make custom view that combine all leads + converted leads? how to do that
    • Reply and react to comments

      Hi everyone! We're excited to bring to you a couple of new features that'll make your sprint process simpler. A cloud application brings with it an array of social media features that can be efficiently used in your organizational setup. As an agile scrum
    • Announcing Early Access to "Zoho CRM for Everyone" — A new and exciting update to Zoho CRM

      Zoho CRM For Everyone is now officially available to all customers, and the Early Access Program has come to a close. We want to extend our sincere thanks to everyone who participated in the program. Your valuable feedback played a key role in shaping
    • Avalara Sales Tax integration - AVATAX

      Just wondering if anyone else is having troubles with this integration?  Seems as though Avalara changed their billing process, unbeknownst to Zoho, and now ALL transactions are counted by Avalara, not just transactions in a taxable jurisdiction.  This caused a huge price adjustment billed to us by Avalara within a month of us signing up.  And Avalara is not cheap to begin with! Avalara has been great in waiving that increase, but there seems to be no fix.  Zoho is aware of the problem, but slow
    • Invalid value passed for description

      Dear Sir, When I am entering the purchase bill , the following message showing "Invalid value passed for description" what should I do ? I am attaching screenshot. With Regards, Harish harish@cracku.in 7978841636
    • Zoho Creator - 2024 Release Projection 1

      Hello everyone! As we enter 2024, we'd like to extend our warmest wishes for success and prosperity. Your fantastic response to our Product Roadmap page last year has been incredibly motivating. Continuing on this path, we're excited to share a glimpse
    • Automation Assistance for Zoho Form Integration and Workflow

      Hi, We are currently using a Zoho Form to send out our Global Credit Application and would like to automate the process further. Specifically, we’d like the ABN number submitted through the form to automatically populate the GST/VAT Number field in Zoho
    • COQL does not return queryable value if the result set is empty

      See linked video for running code illustration of the problem: https://workdrive.zohoexternal.com/external/d49bb40033b43b288d56fdf843095b7c65b28391d3ec5d09c854f416d853003d Moderation update: We are appending the comment that was removed, to add context
    • Zoho CRMでの商談の管理のしかたについて初歩的な質問です。

      先月からZoho CRMを試験的に導入して運用しています。 商談の管理(運用?)の仕方について教えてください。 商談の数が増えてくると、ダッシュボードの「ステージ別進捗状況」にどんどん過去の商談が蓄積されてくると思うのですが、 現在動きのあるものを中心に確認したくなる気がします。 そのあたりについては、どのように運用が一般的なのでしょうか? アドバイスいただけるととてもありがたいです。 よろしくお願いします。
    • Composite Items & Purchase Orders

      The Composite Item is great way to bundle different products and services into a single line and sell it as a single line item in Estimates, Sales Orders and Invoices. However, on the other side - i,e,. Purchasing - this item creates quite a bit of a
    • using custom function is it possible to update the created by field in Zoho Crm custom module

      using custom function is it possible to update the created by field in Zoho Crm custom module
    • Slow Sloww Slowwww Responses

      Good day, Has anyone been experiencing slow responses from support? Since Thursday I migrated my Whats app to Sales Iq and I had to synch with Social to get the otp they were sending. Apparently What's app can't be automatically added so I reached out
    • You have exceeded the maximum number of attempts for this action. Please retry doing the same in 30 minutes.

      When one of Zoho Books user tries to select a vendor, recording a new bill, these message appears: You have exceeded the maximum number of attempts for this action. Please retry doing the same in 30 minutes. Other user, at the same time, but different
    • Enable Conversation Context Retention for SalesIQ Answer Bots

      Hello Zoho SalesIQ Team, We hope you are doing well. We have noticed that SalesIQ bots currently fail to maintain conversation context in Hebrew. For example, when we follow up on a previous answer or ask for clarification in Hebrew, the bot either provides
    • Automatic Hebrew Small Talk Setup Without Duplicate Term Errors & Manual Configuration

      Dear Zoho SalesIQ Team, Greetings, We would like to request an enhancement to the Small Talk feature in Zoho SalesIQ, specifically for Hebrew language support. Current Challenge: When setting up Small Talk for Hebrew, we encounter multiple issues: Simple
    • Should I Add Leads in Bigin?

      ok, first off I'm new here. I just started using Bigin. I'm debating if it's appropriate to enter leads. by leads I mean a list of contacts that I have not yet reached out to...it's a cold calling list.  if I enter them I can track them (I understand
    • Zoho Books - Perform a validation check before an invoice is marked as sent or sent

      Allow the validation rules to apply to button actions. For example: an invoice could not be sent or marked as sent if it has an empty value in a custom field. (The field could remain blank while it is being worked on.)
    • Flow error "given url is wrong"

      when I setup a flow to update a task status, I get an error when it runs that says "given url is wrong."
    • Upgrade Zoho Desk Agent-Side Answer Bot to GenAI

      Hello Zoho Desk Team, We hope you're doing well. Following the recent announcements and rollout of the GenAI-based Answer Bot in Zoho SalesIQ (Nova '25), we’d like to formally request a similar upgrade for the Answer Bot used by agents inside Zoho Desk.
    • Next Page