Javascript Forms API loading forms more than once in static nextjs deploy

Highlighted
Level 1

Javascript Forms API loading forms more than once in static nextjs deploy

Hello Marketo Community, 

 

My team is currently trying to statically deploy a nextjs app. We are using the Javascript Forms API with the standard loadForm method. On the current live site, this works perfectly: 

 

Scroll to bottom of page to see form

https://techstars.com/ecosystem-development

 

However, when we statically deploy to a staging environment, this same form will load twice, and the measures we've taken to remove styles also break. For security reasons, I cannot share this staging site URL. 

 

I have followed the fix mentioned here, which is to use the formReady method to remove the id from the form element, so the inputs cannot be appended a second time. This works wonderfully locally, but when we export and deploy the static build, the duplicate render still happens. 

 

I know this is a long shot, but it feels like this a react lifecycle and or nextjs related issue. Hoping someone has some insight because I'm all out of ideas. 

 

Any help is greatly appreciated! 



 

1 REPLY 1
Highlighted
Level 10 - Community Moderator

Re: Javascript Forms API loading forms more than once in static nextjs deploy

If you're using the code from

 

https://blog.teknkl.com/multiple-forms-multiple-times/

 

and it's not working, but you can't share the page on which it's not working, you're going to have to hire someone who can then be granted access to the private page.