Dynamic Hidden Field Value on HubSpot Form

[cstruble]

Hello! I'm trying to append a hidden value that is dynamic upon a form submit. This value would be different depending on the landing page. From what I understand, you can not change a hidden value at the page level when using a global form and the native HubSpot form element. 

I've found that I can easily append a hidden value (that can be changed at the page level) via the below javascript (which works for our HubSpot forms that are embedded on our WordPress pages).

<script>
hbspt.forms.create({
region: "na1",
portalId: "insert_portal_id",
formId: "insert_form_id",
onFormSubmit: function($form) {
$('input[name="insert_field_name"]').val('insert_value').change();
}
});
</script>

However, I'm not sure how to achieve this with our HubSpot landing pages. We currently use the native HubSpot form element on our landing pages. Is there a way to add this additional javascript somehow?

[cstruble]

@piersg - Thank you. That was exactly what I needed.

Do you happen to know, if the above script could be changed to append a value vs overwriting the value each time?

[piersg]

You can add this script in a custom HTML module or in the advanced settings of the page

<script>
  window.addEventListener('message', event => {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') {
      $('input[name="insert_field_name"]').val('insert_value').change();
    }
  });
</script>