I have an embedded MailChimp form that does not submit. It can be viewed here and other blog pages on the same domain. There are no console errors on submission with all necessary fields filled in.
There have been several questions asked on this issue with answers like using visibility:hidden instead of display:none for hidden fields (link) for hiding groups, using https instead of // (link) but none of these seem to work.
The form as used on the site is this one:
<div id="wp-subscribe" class="wp-subscribe-wrap wp-subscribe wp-subscribe-1" data-thanks_page="0" data-thanks_page_url="" data-thanks_page_new_window="0">
<h4 class="title">Like What You're Reading?</h4>
<p class="text">Subscribe to our mailing list and get blog posts sent directly to your e-mail inbox.</p>
<!-- Begin MailChimp Signup Form -->
<style type="text/css">
#mc_embed_signup{background:#f47555; clear:left; font:14px Helvetica,Arial,sans-serif; }/* Add your own MailChimp form style overrides in your site stylesheet or in this style block. We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */#mc_embed_signup_scroll input{ background-color: #aaaaaa;border-color: #FFFFFF !important;<br />
}input#mc-embedded-subscribe.button {height:50px;}</style>
<div id="mc_embed_signup"><form id="mc-embedded-subscribe-form" class="validate" action="//publiqly.us14.list-manage.com/subscribe/post?u=5e08d0ec976ea8929c31531bc&id=8f3f3445e1" method="post" name="mc-embedded-subscribe-form" novalidate="" target="_blank">
<div id="mc_embed_signup_scroll">
<div class="mc-field-group"><label for="mce-EMAIL">Email Address <span class="asterisk">*</span>
</label>
<input id="mce-EMAIL" class="required email" name="EMAIL" type="email" value="" /></div>
<div class="mc-field-group"><label for="mce-FNAME">First Name </label>
<input id="mce-FNAME" class="" name="FNAME" type="text" value="" /></div>
<div class="mc-field-group"><label for="mce-LNAME">Last Name </label>
<input id="mce-LNAME" class="" name="LNAME" type="text" value="" /></div>
<div class="mc-field-group input-group" style="visibility: hidden;position:absolute;">
<strong>Publiqly Subscribers </strong>
<ul>
<li><input id="mce-group[4669]-4669-0" checked="checked" name="group[4669][1]" type="checkbox" value="1" /><label for="mce-group[4669]-4669-0">Blog Followers</label></li>
</ul>
</div>
<div id="mce-responses" class="clear"></div>
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input tabindex="-1" name="b_5e08d0ec976ea8929c31531bc_8f3f3445e1" type="text" value="" /></div>
<input id="mc-embedded-subscribe" class="button" name="subscribe" type="submit" value="Subscribe" />
</div>
</form></div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[5]='PMPLEVELID';ftypes[5]='number';fnames[6]='PMPLEVEL';ftypes[6]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->
<p class="footer-text">We respect your privacy and take protecting it seriously. No spam, guaranteed.</p>
</div>
It uses a hidden checked group (SO thread on that here) and three standard fields to submit forms and get users added to that MailChimp group on the list. Then we can send them specific email campaigns. But the form does not submit.
MailChimp mentions it may be conflicting with other form validations. Could still be - no JavaScript guru as of yet - but there are no errors on the console.
I checked the form tag and action on it, form fields and so on and I have no idea what the issue is. Help would be appreciated.
