Thanks 🙂
Here's the use case: I'm building a document management system. A document has metadata (6-7 fields), and up to 4 types of content (Word and PDF versions, and an HTML version I generate from Word plus any images from the original Word source). Updating the metadata works fine with a standard form submit.
The document content (Word, PDF etc) can get quite large, so I want to upload them individually. To that end, I built a file-selector-and-uploader component. This component has a number of attributes including content type (Word, PDF etc) to determine where the content should go. Inside the component, there is a file input field wrapped in a form, as well as 4 x API calls, one for uploading each type of content. Selecting the file (single or multiple) inside the component works fine.
In the UI, I present the user with 4 of these components, one for each type of content. The user has to select at least an HTML or PDF version and optionally Word and images.
When they've selected the content they want to upload, a "master upload" button changes the "state" attribute of each component into "load". The component catches the attribute state change, and then submits the form (<-- this is the bit I want to get working). Submitting the form will call the appropriate API with the body encoded as multipart/form-data.
I'm doing it this way because my experiments show that API calls (to Xano in this case) are only correctly encoded if you submit the form (or in my case, 4 forms each inside a component).
I know there are other ways of doing this. For example, I think I could call the API manually without submitting the form, but then I would need to base64 encode the files so I can use an application/json content type.
Hope that helps explain why I need to manually trigger the form submit (to correctly encode the multipart/form-data).
I could of course be going about this all wrong - I'm fairly new to Toddle!
.jpeg/public)