Auto-submit form on WordPress Page

Develop, Build & Integrate APIs & Integrations
1

First off, apologies - I am not a developer but trying to modify the code others have developed and therefore may require a bit of patience :).

Here is my scenario:

  1. User receives email with query string - https://teachtoone.org/demo-account-survey?email=test@email.com&nps_survey_score=10
  2. After clicking the link they go to the page with the form, whereupon the form is automatically submitted with those two values.
  3. The user is prompted to fill out the rest of the form, either through a progressive form, or redirect after form submission to another page with another form (either way would work for me, I just don’t know what is possible).

It seems as though I am having trouble with the first requirement - to auto-submit. On the original WP page I have included the form embed code and tried the following options with the following error messages:

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
 hbspt.forms.create({
 portalId: "43973630",
 formId: "0224d1c8-5d46-4156-96cf-1542b42d3d6f",
 onFormReady: function($form) {
 form.submit();
 }
 });
</script>

I got the error message - “Cannot read properties of null (reading ‘submit’)”

I then tried

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
 hbspt.forms.create({
 portalId: "43973630",
 formId: "0224d1c8-5d46-4156-96cf-1542b42d3d6f",
 onFormReady: function($form) {
 document.querySelector('hsForm_0224d1c8-5d46-4156-96cf-1542b42d3d6f').submit();
 }
 });
</script>

And got the error message - “Cannot read properties of null (reading ‘submit’)”. I then tried

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
 hbspt.forms.create({
 portalId: "43973630",
 formId: "0224d1c8-5d46-4156-96cf-1542b42d3d6f",
 onFormReady: function($form) {
 document.querySelector('0224d1c8-5d46-4156-96cf-1542b42d3d6f').submit();
 }
 });
</script>

And got the error message - “Failed to execute ‘querySelector’ on ‘Document’: ‘0224d1c8-5d46-4156-96cf-1542b42d3d6f’ is not a valid selector.”

Any thoughts about what I should be doing?

Thanks,

Jonathan

2

I figured out that I needed to add a $ in front of form.

So this worked:

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
 hbspt.forms.create({
 portalId: "43973630",
 formId: "0224d1c8-5d46-4156-96cf-1542b42d3d6f",
 onFormReady: function($form) {
 $form.submit();
 }
 });
</script>