Problem with date format

[donacrisante]

Hello everyone,
I'm still having problems with my date format and can't get the date of my trip to show up in my edit form when I click on the edit button in EntryList. I have tried different ways of writing the date, but they never show the desired result. Either I get the date displayed but cannot change it, or I neither get it displayed nor can I change it, or I get an error message. I have written all my attempts in code and commented them out to better understand what I have tried.
I also tried another variant where I created a formatDate component and then added it to my input value. That didn't work either.

Can someone please help me with this?

Many thanks in advance!

Here is my PR:
donacrisante/Capstone-project#11

[Kheirah]

There are a couple of things you need to change.

• The [id].js is in the wrong place. Move it from the pages folder down into the journey-list folder.
• Change the routing accordingly in EntryList

<button onClick={() => router.push(`/journey-list/${entry.id}`)}>
    Edit
</button>

• Change the initial value of the state in EntryForm

const [date, setDate] = useState(selectedEntry?.date || new Date());

• Delete these lines in the handleSubmit of your EntryForm

const dateParts = newEntry.date.split("-");
const formattedDate = `${dateParts[2]}.${dateParts[1]}.${dateParts[0]}`;
newEntry.date = formattedDate;

• Inside the EntryForm change the value of the date input field to this

value={date}

This should fix all your issues concerning dates. You can delete the formaDate file as well since you don't need it.
If you're still experiencing issue, clear the local storage.

[donacrisante]

Hi Ernst,
thanks a lot for your answer. Yes, it works, but if I delete the lines concerning the dateParts, I get the format YYYY-MM-DD when I submit my new entry, and I don't want this, but the following format: DD.MM.YYYY. If I leave the lines as they are, I get the correct format in my Entry List, but the date does not appear when I click edit. But the date can be changed.

Another problem arises when I implement your changes: I get the error message that onSubmit(newEntry) is not a function.

[donacrisante]

I mean when I want to save the changes.

[Kheirah]

You accidentally changed the prop name in [id].js. It should say onSubmit={onHandleEdit}.

As for the display of the format, you don't save the date in a certain format. You save it as is. The format is cosmetic and can be adjusted on the frontend as long as the date is valid.

[donacrisante]

Thank you, Ernst. I have fixed it.