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

    • Ability for Agents to Initiate Voice Calls With Site Visitors Without Active Chat Session

      Dear Zoho SalesIQ Team, Greetings, We would like to request a feature enhancement related to the voice call functionality in Zoho SalesIQ. Current Limitation: At the moment, voice calls can only be initiated by agents after a chat session has been started
    • Add new Card

      How do you add a new credit card to a contact with Zoho API as can be done on web.  I am not able to find way to do this with Books API, CRM API or Subscriptions API.  This is an issue for our company as we do migration from a different system.  I can add card to a subscription through Subscriptions API, but some of our customers may not have a subscription, but only invoices set up in Zoho Books.  Is there any way in Zoho API to add new credit card to contact/customer?
    • Benchmark for Using Mail Merge in Service Order Scopes

      Hello, I was wondering if Zoho CRM has a benchmark or best practices for utilizing Mail Merge in service order scopes. Specifically, I'm looking for guidance on how to effectively integrate this feature for creating and managing service orders, especially
    • This user is not allowed to add in Zoho. Please contact support-as@zohocorp.com for further details

      Hello, Just signed up to ZOHO on a friend's recommendation. Got the TXT part (verified my domain), but whenever I try to add ANY user, I get the error: This user is not allowed to add in Zoho. Please contact support-as@zohocorp.com for further details I have emailed as well and writing here as well because when I searched, I saw many people faced the same issue and instead of email, they got a faster response here. My domain is: raisingreaderspk . com Hope this can be resolved.  Thank you
    • Why don't we have better integration with Mercado Pago or Pagseguro?

      Currently, the integration between Zoho Commerce and Mercado Pago for Brazil is very poor... Since it is old, it does not include the main payment method in Brazil today, which is PIX. Is there a date for this to finally be launched? There are numerous
    • two columns layout

      it's actually frustrating to not have this feature, I actually had to convince my employer to subscribe to zoho forms and integrate it with zoho crm, but because of this feature not beeing provided, our forms looks unnecessarly long and hideous. 
    • Sync Zoho Desk Help Center Category Icons to SalesIQ Articles

      Dear Zoho SalesIQ Team, Greetings, We are using the integration between Zoho SalesIQ and Zoho Desk to sync articles from our Zoho Desk Knowledge Base into SalesIQ. While this integration works well for syncing article content, we’ve noticed a visual inconsistency:
    • Company Name not pre-populating when using Quick Create: Contact

      Hi Devs, This has bugged me for a long time, and it's a simple UX design change to solve it. Problem: Users creating Contacts not linked to Companies/Accounts Cause: When a user creates an Opportunity where after browsing the Contacts they realise they
    • Spell Checker in Zoho desk

      Is there a way to set always check spelling before sending? Outlook does this and it is a handy tool to avoid typos
    • Enable Sync of SalesIQ Article Interactions to Zoho Analytics for Unified Knowledge Base Reporting

      Dear Zoho SalesIQ and Zoho Analytics Teams, Greetings, We’d like to formally request an enhancement to enable SalesIQ article interaction data to be synced with Zoho Analytics, so that we can obtain a unified view of our knowledge base performance metrics
    • How to enter membership share, sold or reimburse

      Hello, First, I am just begining taking care of the accounting of my organisation, and new also to Books. In Books, our accounting plan has an account #3900 - Share capital, that cumulates the share our member pay. How do I write a sale or a reimbursement
    • Ability for me to take the issued PDF certification on successful completion of a course then push to zoho sign in order that it is digitally certified

      How can I take the issued PDF certification on successful completion of a Zoho Learn course then trigger a workflow to push to Zoho Sign in order that it is digitally certified, hosted on the blockchain and then push to Zoho Workdrive to be hosted off
    • Candidates rejection process

      Is there a way to get ZOHORecruit to automatically send out an email to candidates that are rejected?
    • Multi file upload

      Hi, I just wonder if one could upload multiple files in one shot, say between one and three files, without adding multiple File Upload fields? Thanks, Alalbany
    • Passing the image/file uploaded in form to openai api

      I'm trying to use the OpenAI's new vision feature where we can send image through Api. What I want is the user to upload an image in the form and send this image to OpenAI. But I can't access this image properly in deluge script. There are also some constraints
    • Calendar Year View?

      Is there a way I can view the calendar in year view? Maybe create a page with a view like this?
    • ABN Amro

      Hi, We are trying to add Abn AMRO as a bank in Zoho Books. However we get the following error: Type of Error: User Action Required Description: The request cannot be completed because the site is no longer supported for data updates. Possible workaround: Please deactivate or remove the account. Suggested Action: The site will no longer be supported by Zoho Books and should be removed. Does that mean it's no longer supported? Thanks!
    • Add bank transfers via a webhook or API

      Hello ZOHO Books Community, is there anyway to add single transactions to bank accounts via an API or webhook? I found in docs to upload a bank statement. But i want to add a transaction from an external (unsupported bank) in the moment there is a transaction
    • Books does not allow 19% tax rate for invoice - Please help!

      Hi there, I need to do an import of invoices into Zoho Books. The process worked smoothly before we migrated to the Books Germany Edition in December 2024. It does import 13 out of 14 invoices from my csv-file. For the one it does not import I get the
    • When will Zoho Books offer native NFS-e issuing, now with Brazil's National Standard?

      Hello Zoho Team and Community, I'd like to follow up on my previous suggestion regarding the critical need for Zoho Books to natively issue Brazilian Service Invoices (NFS-e). My original idea was that this could be achieved by extending the same integration
    • API 500 Error

      Hello amazing ZOHO Projects Community, I get this message. How can we solve this? { "error": { "status_code": "500", "method": "GET", "instance": "/api/v3/portal/2010147XXXX/projects/2679160000003XXXX/timesheet", "title": "INTERNAL_SERVER_ERROR", "error_type":
    • Admin Access to Subscriber Information for System/Default Bots in Zoho Cliq

      Dear Zoho Cliq Team, Greetings, We would like to request an enhancement to Zoho Cliq's bot management capabilities. Specifically, we are asking for the ability for organization administrators to view the list of subscribers for system/default bots, such
    • zoho webmail keeps opening an empty tab when on log in/vist webmail

      as the the title says, whenever i log in or visit the page in a new tab, zoho webmail with open a new tab, but it errors out (see attachment). how do you stop it from doing this?
    • FSM work order creation on books quote approval

      I have followed https://help.zoho.com/portal/en/kb/fsm/custom-integrations/zoho-books/articles/perform-actions-in-zoho-fsm-on-estimate-approval-in-zoho-books#Step_1_Create_a_connection_for_Zoho_FSM_in_Zoho_Books in order to create a work order in FSM
    • Tip of the week #46 - Stay more organized by moving threads between inboxes

      Have you ever come across a thread in your inbox that should have been handled by a different team or inbox? Or maybe you've wrapped up your part of the conversation, but another team needs to step in to finish the task or assist further? Keeping such
    • Text summarization and field detection with Zia, Zoho's AI assistant

      Have lengthy documents that take forever to read and sign? Tired of placing fields into hundreds of pages? Here's a single solution to solve both challenges: Zia, Zoho's AI assistant. With Zia's integration with OpenAI, you can summarize long documents
    • Sending Links to Functions in CRM

      Maybe I'm crazy, but currently there's no way to send someone a link to a custom function. The only link you can get is to the myfunctions page, which is very frustrating. This should work like workflow rules where when you click on one, it should have
    • zohoからの自動メールについて

      zohoからの自動メールにおいてちょっと困ったことが起こっており、サポートにも相談中なのですが ほかの方にも同現象が発生していないか相談したい。 ▼事象 zohoからの自動メールにおいて時折「このメールが送信者からのものであると確認できないため、このメールに安全に返信できない可能性があります」とメーラーから警告が出る。 ▼状況 発信元:設定した独自ドメイン SPF/DKIM設定:済 利用メーラー:outlook 発生頻度:稀(連続するときもあるが、パタッとでなくなる時もある) サポートへの連絡:ただいま継続相談中
    • Using Deluge scripting to create/update data in TabularSections

      I am having following Form structure with some other usual fields, and a tabular section which allows putting question, self rating and lead rating. (pic below) I am trying to create a record of this form via Deluge, but can't figure out way to populate
    • Zoho Recruit: How to link lookup fields using record ID instead of name during import?

      Hi, I'm having an issue with lookup fields in Zoho Recruit during data import. When I import records into a module that includes a lookup field (e.g., to an Interview record), Zoho Recruit matches the lookup by the display name (string) instead of the
    • Add a "Success" Route to the "Forward to Operator" Card in Zobot

      Hello Zoho SalesIQ Team, We hope you're doing well. We would like to request an enhancement to the "Forward to Operator" card in Zobot. Current Limitation: At present, the "Forward to Operator" card provides the following routes: Operator Not Available
    • Power of Automation :: Auto-update Project status based on Tasklist completion

      Hello Everyone, A Custom function is a user-written set of code to achieve a specific requirement. Set the required conditions needed as when to trigger using the Workflow rules (be it Tasks / Project) and associate the custom function to it. Requirement:
    • Multi Module Lookup Fields

      🎯 Use Case: In many custom implementations, especially those involving financial tracking, service operations, or project-based work, a single record (e.g. an invoice or bill) often relates to one of several different modules — but only one at a time.
    • How to Download a File from Zoho WorkDrive Using a Public Link

      How to Download a File from Zoho WorkDrive Using a Public Link If you're working with Zoho WorkDrive and want to download a file using a public link, here's a simple method to do so using API or a basic script. This approach helps developers or teams
    • Facturation électronique 2026 - obligation dès le 1er septembre 2026

      Bonjour, Je me permets de réagir à divers posts publiés ici et là concernant le projet de E-Invoicing, dans le cadre de la facturation électronique prévue très prochainement. Dans le cadre du passage à la facturation électronique pour les entreprises,
    • Introducing AI Modeler—a no-code approach to adding AI to your business applications

      Forward-thinking businesses today are embracing AI to make life easier for themselves, their employees, and their customers. But if you haven't started yet, you might be concerned that your business will be left behind. Or maybe you're worried because
    • Tip #20 - Three things you probably didn't know you can do with picklists

      Hello Zoho Sheet users! We’re back with another quick tip to help you make your spreadsheets smarter. Picklists are a great tool to maintain consistency in your spreadsheet. Manually entering data is time-consuming and often leaves typos and irregular
    • Zoho People how do i view the history of leave taken

      Hi All What is the report that i am unable to view the history of the leave taken for an individual and team?
    • UK Registration for VAT with existing stock/inventory

      We have an existing inventory of stock and are investigating how to handle the conversion from a UK VAT unregistered company to a UK VAT registered company. Enabling VAT registered status looks extremely easy, but we cannot find any way within Books to
    • Trigger action after workflow

      I would like to trigger a deluge function after the approval workflow is complete. Is this possible? The objective is to take the approved document and move it over to Zoho Contracts to send out to our customer for review and signature. The reason we
    • Next Page