Content Upload from Webflow Form -> Xano -> Webflow

Marcus2423

Hi, I'm curious if I could receive help with a content-uploading issue I'm experiencing with webflow to Xano's backend. I'm attempting to create a web app similar to Patreon where creators can upload large image and video content files on webflow's frontend and have it store the post's content and inputs in the Xano database. Then, using the Xano's API to display the submitted content back in webflows frontend.

Everything seems to run properly when tested through the run and debug however when submitting through the API endpoint I have set up in webflow, I'm able to pass the image upload through the form but the "post-title" and "description" inputs from the frontend aren't passing through to Xano. I've double-checked to make sure the IDs are matching in the database, Xano inputs, and webflow inputs. And followed the form submission and content upload tutorials on youtube.

The images showcase the success in the request history and the database receives the image file submitted through webflow however the input's themselves only pass through to the database when "Run & Debugging" in Xano.

Would love to know what I'm doing wrong if anyone has advice on this.
Thanks!

ReadOnlyLink

Screen Shot 2023-08-14 at 5.57.57 PM.png

Screen Shot 2023-08-14 at 6.03.28 PM.png

Screen Shot 2023-08-14 at 6.06.49 PM.png

Screen Shot 2023-08-14 at 6.12.34 PM.png

Screen Shot 2023-08-14 at 6.13.32 PM.png

Screen Shot 2023-08-14 at 6.13.40 PM.png

Screen Shot 2023-08-14 at 6.14.06 PM.png

Marcus2423

I can't believe it took me almost 4 weeks to realize this! @Lachlan thank you!

Adding this screenshot here in case anyone else runs into this issue. I realized that Xano isn't pulling from the webflow form ID but instead, it's pulling from the Name in the "Text Field Settings" in webflow. As soon as I made the name in the text field settings lowercase it worked! 😅

Lachlan

Hi there @Marcus2423 I noticed you are doing a get request in your webflow form element, and your API is setup as a post request, can you try sending a post instead to see if this resolves the issue?

Marcus2423

Hi @Lachlan it's currently on post in webflow and i get the same outcome

Lachlan

@Marcus2423 apologies, I misread how the buttons worked. Let me do some testing and come back to you shortly!

Marcus2423

@Lachlan no worries, I appreciate you taking the time! - If this helps, I actually made a screen recording that I emailed Chris that walks through everything with more clarity.

Lachlan

@Marcus2423 I haven't been able to re-create the issue on my end, however, I haven't got access to file-upload component in Webflow on my current Subscription.

I'm wondering as a temporary workaround if you could potentially try accessing the inputs via an alternate method.

You could try adding a Get all Input (webhoook) function and setting the encoding to form-URL-encoded as shown in the below screenshot. Then access the variables from the output variable this creates.

Marcus2423

Hi @Lachlan, is that different from using the API as a webhook in my scenario? Currently, the webflow form is a standard form. The upload isn't native to webflow, its simply a memberstack script to attach files.

Not sure if you watched the recording but what's odd is that I'm actually able to pass the content through and it files into the Xano database. The post-title and description also are registered in the Xano input when you're looking at the request history, however, the post-title and description just don't log in the output of Xano. You can see in the screenshot below that the submission coming from webflow logs in the input of Xano but for some odd reason won't output the post-title and description.

Marcus2423

@Lachlan Any luck with this by any chance?

Lachlan

@Marcus2423 I've sought some additional help and the team has let me know that it seems there might be an issue with your code:
https://gitlab.com/xano-marketplace/xano-webflow-api/-/blob/master/xano-webflow-edit-record-with-file-upload.js

Did you by chance use the above code as a base? I haven't had a chance yet to run it myself - however will look to explore this when some time becomes available.

Marcus2423

@Lachlan This is the script being used. Should I be using the one you sent?

Marcus2423

Hi @Lachlan, sorry to bug ya. Would love some guidance on how to get this solved when you have the opportunity

Lachlan

Hi Marcus I haven't been able to figure it out, I've requested some further help I'll be in touch as soon as possible.

Marcus2423

@Lachlan Okay thank you

Marcus2423

Hi @Lachlan, checking in. Any luck with progress on this?

Lachlan

Hey @Marcus2423 apologies that it's taken some time to get back to you. Can you please confirm that in your add record step, you have used the correct case sensitivity that matches your inputs? It looks like there might be a mismatch with capitalization.

Marcus2423

Hi @Lachlan, yes the records match. Here is a loom recording of it working within Xano perfectly, however, it's not receiving the "post-title" and "description" as an output in Xano when submitting from my dashboard.

Xano is processing the content file from the dashboard upload and it passes through just fine. It even registers the title and descriptions as inputs being sent in when we review the request history, however, it's not being passed through to the output.

Lachlan

Hi @Marcus2423, your inputs are coming through  capitalized  Post-Title and Description, but the inputs you have set in Xano are post-title and description.You'll need to either update the inputs in Xano or change the input names in Weblow so they are consistent as these items are case-sensitive.

Marcus2423

Hey @Lachlan Where do you see them capitalized in webflow?

Lachlan

@Marcus2423 we're seeing the capitalization in the inputs you've shown - (which is coming from Webflow)

Alternatively, you can also use the get all inputs (webhook) function. You can then reference this variable.Post-Title. The uploader key is working because it shares the same case sensitivity as the input in Xano.

Lachlan

@Marcus2423 so glad that you have it working now - apologies for the wild goose chase I led you on trying to solve it! I definitely need to revisit using javascript with webflow 😅 Big shoutout to @Chris Coleman who was able to spot the error.