Custom JS for forms

[kenmckown]

I am not fluent in JS, but was trying to create an embed script to put a form on an outside page, while also allowing the CTA to be changed, as well as re-directing the thank you page based on the URL where the form was embedded. Here is my code:

<script src="//go.autoshopsolutions.com/js/forms2/js/forms2.min.js "></script>
<form id="mktoForm_3948"></form>
<script>
MktoForms2.loadForm("//go.autoshopsolutions.com", "180-DGD-014", 3948, function(form){
  form.addHiddenFields({ LastFormURL : document.location.href })    
});
</script>

<script>
{

  const ctaText = "Download Now";

  /* -- NO NEED TO TOUCH BELOW HERE -- */

  MktoForms2.whenReady(function(readyForm){
    const formEl = readyForm.getFormElem()[0],
          buttonEl = formEl.querySelector(".mktoButton[type='submit']");

    buttonEl.textContent = ctaText;
  });

}
</script>

I have also setup the Marketo form to redirect based on the new field I created in Marketo called LastFormUrl

It doesn't work though and instead just stays on the page, which is the default action.

Any ideas?

[SanfordWhiteman]

There’s nothing specifically wrong with the code. However, there’s also nothing in the code that has anything to do with changing the Thank You URL.

You might be changing the Thank You URL in Form Editor based on the field LastFormURL. But that configuration isn’t shown here so we couldn’t say one way or the other!

Also note LastFormURL would have to be the SOAP API name of the existing field for the code to update it via JS; otherwise, the code would be adding an unknown field which wouldn’t be usable on the server.  You can export the field names from Field Management to double-check.

[kenmckown]

I am setting that on the form, you can see my choices here:

And the value is coming in on the form submission:

But it is not redirecting. It just stays on the page.

[SanfordWhiteman]

---

But it is not redirecting. It just stays on the page.

---

Then you have other JS that’s keeping it on the page (i.e. an onSuccess function). It’s not the JS above, which doesn’t directly affect Thank You behavior.

[kenmckown]

I checked the page, there is nothing I can see there. My form is defaulted to stay on page, so it feels like it is ignoring my choices and going straight to the default option.

This is the page it is embedded on: https://shopboss-062824.mystagingwebsite.com/ebook-7-ways-your-shop-management-software-drives-profi...

[SanfordWhiteman]

The form field (and SOAP field) is lastFormURL, not LastFormURL.

[kenmckown]

I updated the code, but it is still defaulting to the same "stay on page" action.

<script src="//go.autoshopsolutions.com/js/forms2/js/forms2.min.js "></script>
<form id="mktoForm_3948"></form>
<script>
MktoForms2.loadForm("//go.autoshopsolutions.com", "180-DGD-014", 3948, function(form){
  form.addHiddenFields({ lastFormURL : document.location.href })    
});
</script>

<script>
{

  const ctaText = "Download Now";

  /* -- NO NEED TO TOUCH BELOW HERE -- */

  MktoForms2.whenReady(function(readyForm){
    const formEl = readyForm.getFormElem()[0],
          buttonEl = formEl.querySelector(".mktoButton[type='submit']");

    buttonEl.textContent = ctaText;
  });

}
</script>

https://shopboss-062824.mystagingwebsite.com/ebook-the-shop-owners-guide-to-the-millionaire-making-k...

[SanfordWhiteman · Accepted solution]

Sorry, the correct field is lastFormUrl. (Which you’d see in Field Management.)

[kenmckown]

Thank you! This works perfectly now!