There is an excellent series here in Laracasts just about using filepond with Vue
https://laracasts.com/series/advanced-image-uploading-with-vue-and-laravel
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
having some issues uploading file(s) inside of a laravel inertia project using filepond,
So far I can technically upload a file as in: laravel moves the file to the storage directory and returns the ID of that file.
But when I submit the rest of my form there is no file id sent with it.
My react codes looks like this:
The FilePond component
<FilePond server={{
process: {
url: "/file/upload",
headers: {
'X-CSRF-TOKEN': (document.querySelector('meta[name="_token"]') as HTMLMetaElement).content
}
}
}}
onprocessfilestart={() => {
setProcessing(true)
}}
onprocessfile={() => {
setProcessing(false)
}}
/>
submitting the form, I use inertia's useForm hook for this.
this is also where the problem arises, filePond put's the ID it receives from the server inside of a hidden input field, but this input field is not being https://shagle.download posted with the inertia form https://omegle.club submit.
function createPost() {
form.transform((data) => ({
...data,
"content": editorRef.current.getContent(),
"serverid": Need this to be the ID returned from the server somehow
}))
form.post(route('posts.store'))
}
Please or to participate in this conversation.