How to format dates?

[NewMedia]

Being able to display page output of a standard mysql DATE format that shows as ‘2020-03-10’
( 10-Mar-2020 )
into the German format :
10.03.2020
10 (day)/03 (month)/2020

is essential.
I’ve looked at Date and Time properties in Wappler but the options are not there for this standard transformation of a DATE type stored in mysql

And the Data Connection Query properties don’t provide a way to handle it there unless I try altering the Query itself.

I looked at Tutorials but this seems to be something still overlooked.

Is modifying the Query to pickup that data in a German Day/Month/Year format the best option?

Thank you.

[Teodor]

@NewMedia
Just use the data formatter and the available dates formatting options to format the date as you like when binding it on your page.

There is no need to alter the query or any other thing related to the serverside or database. Everything is done on the page, using the data formatter.

[NewMedia]

Sounds Groovy.

Where is this
How do I get to it?
I look up one reference after another referring to people having problems but I can’t find where this all started.
What is the secret door in to the “Data Formatter”?

[Teodor]

Well, it’s in the docs:

Formatting Dynamic Data for Client Side Display

[web-works]

To show your dates in German (I did it for Dutch) you can change the values in dmxAppConnect > dmxFormatter > dmxFormatter.js.
Almost at the bottom of the file is:
["Januari","Februari","Maart","April","Mei","Juni","Juli","Augustus","September","Oktober","November","December"],u=["Jan","Feb","Mar","Apr","Meo","Jun","Jul","Aug","Sep","Okt","Nov","Dec"],c=["Zondag","Maandag","Dinsdag","Woensdag","Donderdag","Vrijdag","Zaterdag"],i=["Zon","Maa","Din","Woe","Don","Vri","Zat"]

You can change the values to your own language.

If there is a better way, I would like to know too.

[Teodor]

@web-works
He’s asking about date format, not really about a translation.

[NewMedia]

Lord Have Mercy – THAT is a well-hiddent feature when it gets to only being accessible with RIGHT Click!

At any rate – I am well along the way – thank you for that Help!

Conversion to Date Time formats is one of the more difficult options.

So, I now have a page in a browser that shows the Converted DATE to German format.

But, in the Wappler Live Data view THAT Column is now not visible

So I am suspecting some code needs to be cleaned up EVEN though the Browser Works fine and I see the Dates converted.

Wappler editor with Connect Mode Toggled ON

Yet browser output successfully shows in rendered PHP page.

So here is the suspect code in the page –
I think it should be {event_date.formatDate(dd-MM-YYYY)} instead of
{{event_date.formatDate(dd-MM-YYYY)}}

OK – {event_date.formatDate(dd-MM-YYYY)} manual edit change Works for Wappler Connect Mode and in Browser

Thank you this help!

[Teodor]

@NewMedia
Either use the dmx-text attribute OR bind the data in the table cell. Don’t use both…

Also:

THAT is a well-hiddent feature when it gets to only being accessible with RIGHT Click!

Not sure what do you mean by this, but the data formatter is one of the most used features in Wappler.

[NewMedia]

THIS is the RIGHT CLICK
To see the drop down menu of all the available Conversions –

when all I see is
A event_date
when I look into the Properties panel

Using the Default Click mouse action that is used for 99% of the clicks in Wappler
reveals Nothing – which is why I though I was at a dead end

Only the Right Click Opens the Menu of options I had been looking for …

[Teodor]

Either right click or the + button at the top of the panel. I really don’t get your point

[NewMedia]

This is really a Powerful GADGET

This would really need some Videos to go through all the Power and most importantly how they all apply to common or not-so common problems.

Congratulations on THAT thing!

[web-works]

I was getting to that part.
Select the date to be formatted

Then click the magic stick to the right of the field. Right click the date value > DateTime > Format Date > Select. Then add the wanted format.

[NewMedia]

“When the Data Formats dialog appears, right click the value and you will see the available format options for this data type:”

Good place to Emphasize right click OR “Click the Plus Button + to select from Options Menu”

My intuition was that + was going to select another FIELD name.

Obviously a weak intuition on my part.