Change display format of html input attribute type="date" to European format
Asked Answered
B

1

6

I am trying to make the format showed with the html input attribute type="date" from English format to European format. I only want to display the European format to the user, but not affect the value that goes to the back-end.

enter image description here

Bunkum answered 22/2, 2022 at 12:29 Comment(3)
Does this answer your question? Is there any way to change input type="date" format?Lorrinelorry
I believe it's automatically handled by the browserBiota
"from English format to European format" - English more specifically England uses the dd/mm/yyyy format. Did you mean change to using en-GB locale? Also, English is a European language!Cresa
S
0

You can try to enforce it with HTML

<html lang="de"> <!-- German locale -->

or JavaScript:

const dateInput = document.getElementById('eu-date');

dateInput.addEventListener('change', function() {
  const [year, month, day] = this.value.split('-');
  const euFormattedDate = `${day}/${month}/${year}`;
  console.log(euFormattedDate); // DD/MM/YYYY
});

but, the best practice is just to leave it as is

because the element automatically adapts its "presentation format" to the client's browser or OS locale. (depends upon the browser)

Shillelagh answered 7/10, 2024 at 7:0 Comment(0)

© 2022 - 2025 — McMap. All rights reserved.