62
Views
6
Comments
[OutSystems Data Grid] Date Time Conversion
outsystems-data-grid
Reactive icon
Forge asset by OutSystems
Application Type
Reactive

Hi team,

I need a solution for the OutSystems DataGrid. In my grid, I am using a DateTime column. The database returns the date in ISO 8601 format, but I want to display it in the UI as just the date and time in hours and minutes format. I used the built-in formatter and assigned it the format "MM-dd-yyyy hh:mm".

However, when I apply the column filter with the format "MM-dd-yyyy hh:mm", I want the ISO 8601 format to be used for the active filter parameter.

For example:

  • Input: 2024-08-14T15:30:00.123Z
  • Expected Output in Active Filter: 2024-08-14T15:30:00.123Z

How can I resolve this issue?
here I attached sample OML 

sample: Sample GRID URL

Once the user clicks the filter value, the filtered results will be displayed in a highlighted area. 

Thank you.

Sample_Grid.oml
2022-11-12 11-28-30
Gonçalo Martins
Staff

Hello @Sathish Kumar 

Could you please explain your use case/requirement in more detail?
It seems that you want different date-time formats in different places but is a bit confusing.
If you could give an example step by step it would be helpful also, please share what have you tried so far to make collaboration more efficient.

Cheers,
GM


2026-02-16 06-54-31
Sathish Kumar

Hi @Gonçalo Martins 

In our database API, dates are received in the format 2024-08-14T15:30:00.123Z, but in our data grid, we display them as 09-24-2024 12:17 PM. When a user applies a filter, the onFilterChange event should return the original date format (2024-08-14T15:30:00.123Z). However, currently, the data grid is returning the date in the displayed format (09-24-2024 12:17 PM) during the onFilterChange event. How can we ensure that the onFilterChange event returns the date in the original API format?

2022-11-12 11-28-30
Gonçalo Martins
Staff

Hi @Sathish Kumar 

The filters are returned in the same format as all the displayed dates. 
Everything on the client-side is displayed in the same format so if you want to do something in a different format you will need to convert it inside the OnFilterChange event handler - this is the developer's responsibility since it will not be aligned with the date format defined.

Cheers,
GM

2026-02-16 06-54-31
Sathish Kumar

Hi @Gonçalo Martins 

During an ‘on filter change’ event, I am converting the date and time. Initially, I am passing the date and time with seconds and milliseconds to the grid (e.g., 2024-08-14T15:30:00.123Z). However, after the ‘on filter change’ event, it returns as 09-24-2024 12:17 PM without the seconds and milliseconds. When I try to format it, it returns this value: 2024-08-14T15:30 which causes the seconds and milliseconds to be lost. Consequently, the backend is unable to perform the IN operation correctly.

This records don’t have unique ID as well


UserImage.jpg
Afaque Shaikh

Hi @Sathish Kumar
you can us JS widget and add below code inside your onFilterChangeEvent to format the date. Please find attached oml with updated code. Demo URL

 var formatDate = $parameters.Input;

     var dateParts = formatDate.split(' ');

    var date = dateParts[0].split('-');

    var time = dateParts[1].split(':');

    var ampm = dateParts[2];

    var hours = parseInt(time[0]);

    var minutes = parseInt(time[1]);

    if (ampm === 'PM' && hours !== 12) {

        hours += 12;

    } else if (ampm === 'AM' && hours === 12) {

        hours = 0;

    }

    var isoDate = new Date(Date.UTC(date[2], date[0] - 1, date[1], hours, minutes));

$parameters.Output =  isoDate;

Sample_Grid_Updated.oml
2022-11-12 11-28-30
Gonçalo Martins
Staff

Hi @Sathish Kumar 

Any update on this topic you might want to share with the community?
If you have a solution that can be useful for other community members.

Cheers,
GM

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.