Skip to main content
Contributor I
October 28, 2024
Solved

Same Pop Up Form for Multiple Buttons with Different Submit Events

  • October 28, 2024
  • 1 reply
  • 59 views

I’m trying to use pop-up forms to collect email addresses before allowing visitors to download files. So far I’ve figured out how to get it to work when there’s only one download on the page, but I’m trying to figure out how to make it work when there are multiple downloads on the page.

Here’s the code I have so far:

var downloadURL = "";

var downloadLinks = document.getElementsByClassName("klaviyo_form_trigger");

for (var i = 0; i < downloadLinks.length; i++) {

    downloadLinks[i].addEventListener('click', popUp, false);

}

 

var popUp = function(e) {

  var attribute = this.getAttribute("data-download");

  downloadURL = attribute;

  window._klOnsite = window._klOnsite || [];    

  window._klOnsite.openForm('WRbG6e');

  e.preventDefault();   

};

 

window.addEventListener("klaviyoForms", function(e) { 

    if (e.detail.type == 'submit') {

     window.location.href=downloadURL;

    }

});

 

This seems to work fine for the first submit, but nothing after.

Any ideas?

    This topic has been closed for replies.
    Best answer by PiDesign

    Got it to work by changing this:

    if (e.detail.type == 'submit') {

    to

    if (e.detail.type == 'stepSubmit') {

    1 reply

    PiDesignAuthorAnswer
    Contributor I
    October 31, 2024

    Got it to work by changing this:

    if (e.detail.type == 'submit') {

    to

    if (e.detail.type == 'stepSubmit') {