Fileupload in Single record editing with custom page
im trying to follow this instruction online https://laraveldaily.com/post/filament-edit-only-single-record-custom-page, but the example was only for text input.
I try something like fileupload for my case, since the mountng and saving data work around array, i have a problem for fileupload (filepond).
instead of saving the filename, it save a weird json (logs on the bottom)
and the tmp file are not moved to the storage disk, is there a way to make fileupload in my custom page works like in resource page ?
https://pastebin.com/YypB3kbd (the code)
Pastebin
EditSchool.php - Pastebin.com
Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.
Solution:Jump to solution
Thanks for all the help, i had to manually mutate the file before storing in db, so it will take the actual file path
```php
public function save(): void
{...
24 Replies
Is this what your looking for?
->preserveFilenames()
https://filamentphp.com/docs/3.x/forms/fields/file-upload#preserving-original-file-names
i dont think so, since the save method are taking form to array resulting the filepond instance to be like this
i do tinker around to fix it by manually moving from tmp to storage disk
but the solution just creating another problem
lets say i do successfully store the file i just upload, next time im trying to update the data without touching the file, its getting back to the weird json stuff again, but this time beause the original image are not exist in tmp
right now im looking for best practices or the correct way to fix it, because i can see some plugin having fileuploads in their custom pages, and they still manage to overcome my problem


Also, when using the data from your form you should use: $data = $this->form->getState()
Its not that either :”
Why are you overriding the default saving of the images?
The file upload field will always be an array even if it’s just one image. Seems like you’re not compensating that in your save functionality.
Well if im not overriding it it will store an array instead of actual file name, that what happens. You can check the log, but instead all of that it only save
{uuid : {}}
Im kinda lost and cant find any example online
That’s kind of my point. If you source dive the component it’s handling the array vs not array on saving. But you’re overriding that and not handling it.
The sql screenshot happen when im overriding it, if im not doing it it stores empty value of the uuid like
uuid : {}
But first i wanna appreciate the help <3
I will take a look again of it <3
Then something else in your app is changing it. But default unless the field is set to multiple, the only thing stored in the db for the file upload is the storage path for the image.
If it’s multiple, then it will be an array of the storage paths.
The uuids aren’t stored by default since they are dynamic on hydration of the field.
Could be a possible mismatch of casts on the model?.
Yesss, i expect this as well
Since i happen to have fileupload in one of my resources (same model) and it works out of the box with local disk and the destination
But when i use it on custom page (before im adding code to override the file upload because it wont upload automatically), it stuck on the tmp folder and when im saving it, and the db value for the image is a json with uuid as a key and empty object
Make sure you are calling form->fill() in the mount method of the custom page.
Kinda of making some guesses here without the full code. Don’t hate me.
I have the full code in pastebin there, you may take a look at it, i’ll remove the overriding part and make it default like the tutorial
I do the form fill as in the code i provide
I’ll get the model as well <3
Be right back
and this is my project dbml
https://dbdiagram.io/d/paskib-67585573e9daa85aca451275
A Free Database Designer for Developers and Analysts
Quick and simple free tool to help you draw your database relationship diagrams and flow quickly using just keyboard
i did not override the fileupload this time
https://pastebin.com/BcQBKm2h
Pastebin
EditSchool.php (default) - Pastebin.com
Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.

I didn't follow the messages but I think the issue is that you are not using $this->form->getState() to get the form data
you can validate and get the form's data using $this->form->getState(). It's important that you use this method instead of accessing the $this->data property directly
https://filamentphp.com/docs/3.x/forms/adding-a-form-to-a-livewire-component/#adding-the-form
I see ! thank you for it, but when i try it, now the file is finally moved to the disk and destination automatically
but somehow the db value for the file are still json, but this time it has value of correct path

Remove this->validate
Oki, i just did right now and check its still the same
the data still stored like this


Solution
Thanks for all the help, i had to manually mutate the file before storing in db, so it will take the actual file path