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

    • Zoho Books | Product updates | June 2025

      Hello Users, We’ve rolled out new features and enhancements in Zoho Books, from the option to record advances for purchase orders to dynamic lookup fields, all designed to help you stay on top of your finances with ease. Introducing Change Comparators

    • Widget Upload to CRM Fails with “Page Not Found” – Even with Correct Index Path

      I'm building a simple widget to export Contact data to CSV in Zoho CRM, triggered via a custom button. The widget uploads cleanly, appears in the widget list, and is successfully assigned to a Contact detail view via a custom button. But when clicked,

    • Account disabled

      I have an issue I need help with. Whilst trialing ZOHO CRM I created the following: Account1 (-------------) using m__ame@m__rg___s__i__.___.__ and 2 personal emails Account2 (-------------) using a personal email and 2 users _al__1@______________._o_.__

    • How can we manage the tags in ticket

      Allowing agents to use Tags indiscriminately can cause havoc. We could not find tag management where 1. The admin can create Tags beforehand for use by Agents 2. Permission can be allocated which roles/profiles can use existing tags or add new tags 3.

    • Feed Notifications filter?

      I'd like to have filter settings for Feed Notifications just like we have for Personal Email. If someone dumps a bunch of files into a project, we get a notification for every file!

    • Custom fields and filters for Timesheet

      HI Zoho Projects team. IT would be great and useful if we can add custom fields to the Timesheet design And is needed more options for filtering the timesheet dashboard, like "Milestones" and task list asociated to the record. Thank you

    • How do I rename the dropdown that contains a form and a report?

      I want to rename this, but I can't find how

    • Filtering two fields

      Hoping somone can assist, i am trying to create a report to show values from two different fields. e.g I have Field 1 Field 2 In some records, fields 1 and 2 are both "yes"; in other records, only one of the fields has the value "yes". Can we generate

    • Unable to Convert Quote to Invoice – Integration Active but User Not Recognized

      I’m having trouble converting a Quote into an Invoice inside Zoho CRM, even though the Zoho Finance Suite integration is enabled (Invoices, Quotes, Products, and Customers are all checked), and my user is an Admin in both Zoho CRM and Zoho Books, using

    • Owner drawings

      I entered an owner’s drawing transaction in 2023 but it’s still appearing on 2024 books. Is that supposed to happen? Or should Is there an additional step? I prefer for this transaction not to appear.

    • Running Balance in Account Statement.

      Running balance should come by default in the accounting statements but in ZOHO we need to customize every time to get the running balance in accounting statement. I did not understand, when the bank account statement opened from Bank Menu can show the

    • Importing Invoices

      Dear Team I used the enclosed csv file to import some invoices and it worked fine. I had to delete the file and when I am trying to re-upload it, I am getting the error for invoice number and branch "Resource does not exit." I tried a number of different

    • Enhance "Send Cliq Notification" Action in Zoho Desk Workflows (and also add Happiness Rating Support)

      ello Zoho Desk Team, We hope you're doing well. We’d like to submit a feature request regarding the “Send Cliq Notification” action available in Zoho Desk workflows — specifically in workflows triggered by Happiness Ratings, but also relevant to all workflows

    • Treatment of Non-Refundable Income after cancelling an Invoice

      A customer made part payments of 30,000 for an invoice 0f 100,000, and then he is unable to pay up the remaining and has asked for a refund. As per company policy, he can only get 75% of the amount paid, which is 22,500. The remaining 7,500 is non-refundable

    • I need refund

      I have purchased the Zoho Book standard plan; I had the impression that I would get the purchase > Bill feature. After purchasing, I found that billing is not included in the Zoho standard plan. I immediately canceled the subscription. I love the product,

    • Handling identifiers during an import

      Importing your data When importing data into an application, it is crucial to prevent data loss or duplication. These types of errors can hinder the development of a clean and well-organised database, which is essential for effective data management and

    • Creating Deposit Invoices

      Hi, we are a company that does project based work with a request at the begining of each project for a deposit payment. At the moment we are creating invoices for the deposit and an invoice for the completion of the project, however they are completely

    • Marketer’s Space - WhatsApp Pricing Update: What Marketers Need to Know and Do

      Hello Marketers, Welcome back to Marketer’s Space! WhatsApp made changes to their pricing model on July 1, 2025, moving from conversation-based pricing to a per-message pricing model. This week’s post focuses on what these changes mean for your WhatsApp

    • It's time to say goodbye to Zoho Recruit for me.

      Hello, I have been a Zoho Recruit user since 2013. The tool has evolved, with a better UI, new features and so on. The pricing is still a great asset too. BUT, that being said, important features are not coming fast enough. I tried to share my point of

    • change subscription within customer portal

      Would be great for the customer to be able to change their own subscription (or restart existing one) within the customer portal. Also, would like to be able to have early termination fee on subscriptions if canceled early.

    • How to make the add-on optional at the time of subscription?

      The scenario is this, we have a service which has optional add-ons. Like the customer who purchased the subscription may or may not want to get the add-on. In our case if the customer choose the addon we have monetary benefit. In case the user does not

    • Unable to add attachments to knowledge base anymore

      I have been adding articles to knowledge base in Zoho Desk (as part of Zoho One). Today suddenly i found that I am unable to upload and attachments to the articles. I get the following error: "Attachment couldn't be added." I have uploaded the screenshot

    • Advanced factors for multiple scoring rules: Now with Zia scoring automations for all modules

      Greetings all, We're happy to offer improved scoring features by adding extra scoring factors, including Zia Scores, in our multiple scoring rules (MSR) feature. These new factors—which empower existing traditional scoring factors—include criteria for

    • Sortie de Zoho TABLE ??

      Bonjour, Depuis bientôt 2 ans l'application zoho table est sortie en dehors de l'UE ? Depuis un an elle est annoncée en Europe Mais en vrai, c'est pour quand exactement ??

    • Restrict Agents from Editing Shared Custom Views in Zoho Desk

      Hello Zoho Desk Team, We hope you're doing well. We’d like to submit a feature request regarding the custom views functionality in Zoho Desk. 🎯 Background We’re actively using custom views to filter and display tickets for different teams based on specific

    • Introduction Dario Schiraldi Deutsche Bank Executive

      Hello Everyone, Dario Schiraldi serves as a key leader at Deutsche Bank, where he plays a crucial role in shaping the bank's strategic direction and driving operational success. With a solid foundation in finance and leadership, Dario is committed to

    • Is Zoho Shifts included in the Zoho One plan?

      In case the answer is no: there's any plan to make it available via One? Thank you

    • Feature Request: API Access for Managing Deluge Functions (with OAuth & Change Tracking)

      Hi everyone, I wanted to share a thoughtful request that came in from one of our Zoho clients this week. I believe many of us as partners and developers might relate to it. “One quick item to flag: we’d love an official way to manage Deluge functions

    • Moving Subscriptions from one Customer to another

      We frequently need to move subscriptions from one Customer to another Customer in Zoho Billing and the only way we have figured out to do this is to cancel it in the old owner's profile and manually recreate in in the new owner's profile. In doing this,

    • how to add new line in Deluge?

      I want to make string with line separation like this: this is the first line second line third line I have tried to use \n <br> or </br> inside the string but I can't achieve the result like the example above. I want to create a task by using custom function

    • How to pause a subscription/recurring order ?

      Hello, I'm evaluating Zoho Subscriptions for a food co-op where members order a box of produce every week. The software that we're currently using allows members to set up a recurring order. Members can pause the recurring order when they don't want a box for a while and then resume it later. Is it possible to pause/resume a subscription ? Thanks John

    • Hosted Payment Pages - how to update the address in zoho billing

      I"m playing around with the muti-page hosted payment pages which have places for customers to enter their addresses when paying. Why does this not update their address in Zoho Billing after payment? What can I do to make this happen?

    • Tracking training certification expirations

      Hi Zoho Community! I'm looking for some input on the best and most efficient ways to track training expirations in Zoho CRM. I have a very specific workflow that I am looking for - my company offers trainings, and the certification expires every 2 to

    • Kaizen #164 : Client Credentials

      Hello everyone, Welcome back to Kaizen. In this post, we will discuss Client Credentials Flow and when it can be used. What is Client Credentials Flow? According to RFC6749, the official specification for the OAuth 2.0 authorization framework, "The client

    • CRM Email Template Align Left Instead of Center

      Is there a way to make a basic template align to the left instead of center? I know I'm likely forced to the 600px wide with the basic templates but I would REALLY like to set the email to the left instead of center. The basic templates make all the emails

    • Client Script - "Click' Button on Purchase Order - Specify "To Contact" or "To Supplier"

      The send email button is unique on the purchase order in that is has an additional submenu to send email "To Contact" or "To Supplier" It appears that the "click" event in Client script doesn't work correctly, probably because the button click didn't

    • Add Client Credentials Flow to Python SDK

      The Zoho CRM API supports a client credentials flow to automatically generate ephemeral access tokens, and this can be done programatically. The Python SDK however requires you to provide a grant token, refresh token, or access token when initializing

    • Conditional display of fields in Zoho Books Custom modules based on another field

      We're currently working with a Custom Module in Zoho Books and have a question about improving data entry efficiency and user experience. Our module includes a "Client Type" dropdown field, which determines the type of information to be collected. Each

    • Background Image for page in Zoho Creator

      Is it possible to use an image as the background in a page in Zoho Creator? I see it is possible to use an image as the background within a panel, but about about the page itself?

    • Zoho IP address blocked by Microsoft

      Today I tried to send emails to Outlook email addresses and all of them failed. The log displays like this: Reporting-MTA: dns; mx.zohomail.jp Arrival-Date: Fri, 27 Jun 2025 12:52:30 +0800 Original-Recipient: rfc822; ######@outlook.com Final-Recipient:

    • Next Page