I'm using a Plugin (boxzilla) to show a Popup with a Newsletter-subscription form, which is connected to mailchimp.
My goal is to grant access to a file, right after entering the email adress (and register to the newsletter).
So far I wrote a script, which should open a link (accoring to stackoverflow-post-3749231), after clicking the submit button of the newsletter-form. But this doesn't work:
Popup
<div class="newsletter_popup">
<div class="newsletter_textbox">
Some text
<!-- newsletter form -->
[mc4wp_form id="1234"]
<!-- The Download-link -->
<a href="https://docs.google.com/uc?id=0B0jH18Lft7ypSmRjdWg1c082Y2M" download id="download" hidden></a>
</div>
</div>
<script>
// select the button inside the mailchimp form
jQuery('.popup-newsletter_button').click(function(){
document.getElementById('download').click();
});
</script>
LINK on Page
<!-- opens the popup 'boxzilla-1' -->
<a href="#boxzilla-1" rel="nofollow">Open Box</a>
FORM ([mc4wp_form id="1234"])
<form id="mc4wp-form-1" class="mc4wp-form mc4wp-form-1234" method="post" data-id="1234" data-name="Newsletter Registration">
<div class="mc4wp-form-fields">
<div rel="text" class="popup-newsletter_email">
<input type="email" name="EMAIL" required="">
</div>
<div rel="text" class="popup-newsletter_button">
<input type="submit" value="Anmelden">
</div>
</form>
After submit the popup reloads and shows some 'thank-you'-text (mailchimp plugin) I guess I have to place the script somewhere else then? It seems like, I can't access the submit button:
//Doesn't work either
jQuery('#mc4wp-form-1').submit(function(e) {
document.getElementById('download').click();
}
What is the best practice to achieve this task in general?