Forms Reactivity, hidden conditions
I have tried for a couple of days now to make a form to register some times. The and are hidden or shown if the user has checked the "all day" checkbox or not.
The problem is that i then have to have one field with the and one field with the with the same field name.
I didn't manage to make that work, so what i did is making those fields with different names, and add some hidden fields with the actual field names that are used in the DB and pug $set in those fake name fields in the afterStateUpdated.
I managed to make it work on the create process.
The problem now is on the edit page. since my fields have fake names in the schema, it won't pick the data from the DB.
Do anyone have a suggestion how to solve this?
Here is the stripped version of the code:
https://gist.github.com/torriv83/e9bfd0bd4a219e0e1f2f5cf656f78d5a
Solution:Jump to solution
I finally manged to do it. i had to name the other two fields differently, and then i used mutateFormDataBeforeFill to fill those two. and now it works. Thanks for the help tho!
22 Replies
Anyone had a look? 🙂 i'm still stuck on this.
Are you only using the form builder package?
no, i'm using the panel
Is filling the edit page not working or saving?
when i
When i'm editing, the times won't be prefilled
everything else in the form is filled correctly.
You could try with the
beforeFill() methodI also don't quite understand why you have problems with multiple components with the same name?
i'll try. thanks.
the only thing i try to do is show the datetimepicker if allday is not checked, and the datepicker if allday is checked.
But if you remove all extra components what is the problem?
i'm not sure if i follow you. what do you mean?
Well what doesn't work if you just only keep the datetimepicker and the datepicker fields
So not the duplicate fields with fake names
so, i removed the hidden fields, and named the other fields to the actual name they need to have. in the creation process, everything works.
in the edit, i get this error in my console:
e specified value "2023-08-22" does not conform to the required format. The format is "yyyy-MM-ddThh:mm" followed by optional ":ss" or ":ss.SSS".
b
and the times does not get filled
if i remove the datepicker fields, it works... so i guess thats why I tried to name the fields differently.
So your datetimepicker and datepicker field have the same name?
yes. they are saved in the database like this:
2023-08-22 14:00:00
or if all day:
2023-08-22 00:00:00
and i also have a column in my database called allDay that has either 0 or 1
You could have only that two fields with the same name. And use the
beforeCreate, beforeFill, beforeSave to alter the datai have never used those hooks before, so i'm not sure how to use them to solve my issue. do you have some examples to give me? the documentation did not give me much examples.
I think there are a lot of examples in this discord
Just search on those words
You could also use mutators to fill the shown fields with the data from the actual field when getting the model
Solution
I finally manged to do it. i had to name the other two fields differently, and then i used mutateFormDataBeforeFill to fill those two. and now it works. Thanks for the help tho!