Here are some points to keep in mind when adding custom JS to your form:1. Place your JavaScript code inside a <script> tag like this:
<script> // Your JavaScript code here </script>
2. Ensure that only JavaScript code is added to the box. HTML tags (except script tag) or other languages will not work.Valid code:
<script> (function() { // Google Tag Manager script (function(w,d,s,l,i){ w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'}); var f=d.getElementsByTagName(s)[0], j=d.createElement(s), dl=l!='dataLayer'?'&l='+l:''; j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl; f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-XXXXXX'); // Create the noscript element var noscript = document.createElement('noscript'); var iframe = document.createElement('iframe'); iframe.src = 'https://www.googletagmanager.com/ns.html?id=GTM-XXXXXX'; iframe.height = '0'; iframe.width = '0'; iframe.style.display = 'none'; iframe.style.visibility = 'hidden'; noscript.appendChild(iframe); // Insert the noscript element into the body document.body.appendChild(noscript); })(); </script>Invalid code with HTML tags inside the custom JS box:
<!-- Google Tag Manager --> <script> (function(w, d, s, l, i) { w[l] = w[l] || []; w[l].push({'gtm.start': new Date().getTime(), event: 'gtm.js'}); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'GTM-XXXXXX'); </script> <!-- End Google Tag Manager --> <!-- Google Tag Manager (noscript) --> <noscript> <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXX" height="0" width="0" style="display:none;visibility:hidden"> </iframe> </noscript> <!-- End Google Tag Manager (noscript) -->3. Check your code syntax in a code editor like VSCode. After ensuring there are no syntax errors, copy and paste it into the form’s custom JS box.4. If you need to add HTML code to your page, use JavaScript DOM manipulation methods. Refer to point 2 for valid examples of manipulating the DOM with JavaScript.5. you can add multiple JS codes with multiple script tags inside custom JS, but avoid using nested script tags.
valid code:
<script> console.log("inside script 1") </script> <script> console.log("inside script 1") </script>invalid code:
<script> console.log("inside script 1") <script> console.log("inside script 1") </script> </script>Here are all Formaloo custom events you can listen to and track by JS:
"formaloo_beforeLoad" "formaloo_load" "formaloo_loadFail" "formaloo_init" "formaloo_submitRequest" "formaloo_submitSuccess" "formaloo_submitFail"