Open torian257x opened 5 years ago
dany-eudes
commented
5 years ago Divide to conquer. Maybe you can make each tab a separate Vue component. Then, each one will have its own model. In the end, if the API returns which field the error occurred, it will be possible to find out which model has that field, and consequently on which tab this model belongs.
Maybe you can also validate each step, but I believe you can't.
torian257x
commented
5 years ago @dany-eudes well I was trying to make it as painless as possible to not change my existing code
I added div with a class of the tabnr e.g. classes mytab mytab--3
the error would return field homePhoneNr
so i added that as class to the input field
now with jquery I can lookup .homePhoneNr
I then look for the closest mytab and substring after mytab--
a cleaner solution would be nice. For example, letting users add arbitrary data to the input fields, not only defined ones.
e.g. in the form schema, and as well on the tab content, and wizard component. Because I would have liked to just add a class or data-tabnr='3' instead, but you cannot
love your plugin! and vue form generator too, sooo good.
our project: we have 20 tabs we btw hide the nice icons etc... its nice, but we show a progress bar with % instead.
Now the user fills out 20 steps, and finally presses submit. The data is sent via ajax, and maybe returns an error, say: zipcode: must be at least 5 chars.
I want to display this error. Yes, I can just ensure the user enters 5 chars in the zip code field myself, but as we send via ajax to an api, this api can have an issue we didnt plan. So in any case I need to display api errors.
How do I find the active field, I mean find out which is the active tab? which field -> I just add a class that is the same as what we have as field names.