[Data Grid Reactive] Format options format in Date column
Forge component by Bruno Martinho
Application Type

Thank you for this new release!  The action column is working great to open URLs.

Are there options for selecting a date format provided with the Date Column?

We are formatting the date in the advanced sql data action, but that format is being overridden by the Data Grid Reactive component, regardless of whether we use a date or a text column for display.

We would like the date to be displayed as YYYY-MM-DD.

Hello @Jared Jones ,

Can you please share how you are formatting the date in the advanced query, how it is being shown in the column and how you would like to see the date?


Bruno Martinho

Thank you for the response, Bruno.  Here are the answers to your questions.

The data is stored in the database as DateTime.

Here is how the column is processed in the Advanced SQL:

      CONVERT(varchar, person.DateArrived, 23) AS DateArrived,

Here is the date data as it appears in the JSON that is fed into the DataGrid:

        "DateArrived": "2017-09-14",

And here is the Date column in the DataGrid:

We'd like the date to display in YYYY-MM-DD format:



Side note:

As a test, I removed the CONVERT operation in the Advanced SQL query.

In that scenario, here is the output of the Date column in the DataGrid:

Hello @Jared Jones 

Thank for the reply with so much detail.

In fact, the way the Data Grid is working is using the Date time format that is configured in Service center to format dates that are presented to the end user. We followed this approach to display dates exactly the same as other OutSystems components that use dates.

Can you please check if the definition that you have in Service center is the same format as you are seeing in the data grid?


Bruno Martinho

You wrote 

"We followed this approach to display dates exactly the same as other OutSystems components that use dates. "

But this is not even a half-truth.  

ServiceCenter has no support for many dateformats and in other component we need to use the buildt-in-function "FormatDate" to show the correct values. If we have users from different nationallity we combine this with a client-vataibale for "MyDateFormat".

I can't see the possibility to use this buildt-in function on DataGrid for Reactive?

This is a nice component, and the possibility to use build-in or other function in cells to format the output would have done this great!. If the cell is read-only this shold be easy, or?

Hello @Stein Jørgen Dahle,

Currently we don't have a public API to set up the Date format. 

To change it, you can add these two JS rows in the OnReady event of the page that has your grid:

GridAPI.ColumnManager.GetColumnById($parameters.ColumnId)._editor.format = 'MM/dd/yyyy';

GridAPI.ColumnManager.GetColumnById($parameters.ColumnId).provider.format = 'MM/dd/yyyy';

The parameter ColumnId should be your number column id:

We know this isn't the ideal solution.

To build a solid solution, how do you see this configuration being set? At the column level, at the grid level? An input parameter, a client action?

Hope to hear your feedback,

Bruno Martinho

Thank you, I will give you a feedback as soon as possible

For a Date or DateTime Column it would be nice to have an optional Column Config for the date format. Make it a dropdown of options or simply type it in e.g. "MM-DD-YYYY". Default to the Service Center value if no option is put in.

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