CMS Development

matttunney
Top Contributor

Removing jquery from advanced form embed code

SOLVE

Hello,

Can someone please provide a little more clarity on the advanced form embed script please?


I am trying to remove jQuery from my site and hoping to remove jQuery calls on my form embed codes.

 

https://legacydocs.hubspot.com/docs/methods/forms/advanced_form_options

 

If I am no longer using jQuery do i still need to call `$form` on the `onFormReady` callback function to manipulate the form?

 

Right now i use jQuery to pass across the referrer value:

onFormReady: function($form) {
  $('input[name="form_page"]').val(document.referrer).change();
})

 

Can I adjust this to the following without issue:

onFormReady: function() {
  var form_page = document.getElementsByName("form_page")[0];
  form_page.value = document.referrer;
  form_page.dispatchEvent(new Event('input', { bubbles: true }));
})


 Thanks

0 Upvotes
1 Accepted solution
Teun
Solution
Recognized Expert | Diamond Partner
Recognized Expert | Diamond Partner

Removing jquery from advanced form embed code

SOLVE

Hi @matttunney ,

 

Yes you can! Or switch to the window events that are available:

 

  window.addEventListener('message', event => {
    if (event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormReady') {
      // Your code here.
    }
  });

 

If you want to change the value of anything other than a radio or checkbox input, you can use the dispatchEvent. If you want to change the value of a checkbox or radio input, use click instead:

 

if (input.type === 'checkbox' || input.type === 'radio') {
  input.click();
} else {
  input.value = value;
  input.dispatchEvent(new Event('input', { bubbles: true }));
}

 



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


View solution in original post

2 Replies 2
Teun
Solution
Recognized Expert | Diamond Partner
Recognized Expert | Diamond Partner

Removing jquery from advanced form embed code

SOLVE

Hi @matttunney ,

 

Yes you can! Or switch to the window events that are available:

 

  window.addEventListener('message', event => {
    if (event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormReady') {
      // Your code here.
    }
  });

 

If you want to change the value of anything other than a radio or checkbox input, you can use the dispatchEvent. If you want to change the value of a checkbox or radio input, use click instead:

 

if (input.type === 'checkbox' || input.type === 'radio') {
  input.click();
} else {
  input.value = value;
  input.dispatchEvent(new Event('input', { bubbles: true }));
}

 



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


matttunney
Top Contributor

Removing jquery from advanced form embed code

SOLVE

That is perfect 
Thanks for your response and examples 

0 Upvotes