• Resolved glatz2crs

    (@glatz2crs)


    I built a form with Forminator, and have a text area that I’d like to open an alert when it is clicked. In the code below, the point 1 alert comes up when the page loads, but when I click on the element #html-1, nothing happens. I have a feeling the problem is the content hasn’t been completely loaded, but the DOMContentLoaded listener should have solved that. Is there anything about Forminator causing this? thnks!

      document.addEventListener("DOMContentLoaded", function () {
        var element = document.getElementById("html-1");
    
    		alert('point 1')
        if (element) {
    		alert(point 2')
          element.addEventListener("click", function () {
            alert("Element with ID 'html-1' was clicked!");
          });
        }
      });
    
Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Mircea Sandu

    (@gripgrip)

    Hi @glatz2crs,

    Have you tried moving the script to a Footer location like “Site Wide Footer”? That should make sure the page is already loaded before the script is executed.

    If the element you are targeting (#html-1) is loaded using AJAX you will need to use a different event listener, I think that might depend on how your form is set up.

    Please reach out using the form at https://wpcode.com/contact and share a link to the page and we can take a look at the page setup.

    Thread Starter glatz2crs

    (@glatz2crs)

    Thanks for the suggestion. I tried putting it in the global footer of Forminator and also in the theme footer, but now I see why that wouldn’t work. It turns out the problem was I told it to load the form using ajax. Loading it with the page made the element exist after DOMContentLoaded. Ic Ould have loaded it with Ajax if there was a way to create a post form load hook, but there really isn’t an advantage to using Ajax for loading the form.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘adding event listener with forminator’ is closed to new replies.