Display dateCreated and dateModified Based on User Timezone

Introduction

Displaying date and time values accurately according to the user's timezone is crucial for providing a personalized experience in your application. In this guide, you will learn how to use BeanShell Formatter to convert and display dateCreated and dateModified columns based on the user's timezone. This ensures that users see date and time information in a format that reflects their local time zone.

How does it work?

The BeanShell Formatter allows you to adjust date and time values according to the user’s timezone. By using the provided Java code, you can format dateCreated and dateModified fields to reflect the user's local time zone. The code leverages Joget's utilities to handle timezone conversion.

1. In the List Builder, go to the dateCreated column and set the Formatter as BeanShell.
   
2. Here’s a sample BeanShell Formatter script to convert date values. Paste the following code into the Script section:
   

   import java.text.SimpleDateFormat;
   import org.joget.commons.util.TimeZoneUtil;
   import java.util.Date;
   import org.joget.apps.app.service.AppUtil;
   
   try {
       String pattern = "yyyy-MM-dd HH:mm:ss.S";
       SimpleDateFormat simpleDateFormat = new SimpleDateFormat(pattern);
   
       Date date = simpleDateFormat.parse(value);
   
       return TimeZoneUtil.convertToTimeZone(dateCreated, null, AppUtil.getAppDateFormat());
   
   } catch (Exception e) {
       return value; // fallback to original value if error
   }

   

3. Apply the same setting for the dateModified column.
   
4. Save the changes.

Expected Outcome

After implementing the BeanShell Formatter, the dateCreated and dateModified values will be displayed based on the current user’s timezone instead of the server’s default timezone.

Download Sample App