JS проверка формы не работает, если форма находится внутри модального div - PullRequest
Новая
       15

JS проверка формы не работает, если форма находится внутри модального div

0 голосов
/ 29 января 2020

У меня проблема с Mailchimp JS валидация m c -validate. js ... Валидация формы работает отлично вне намерения выхода Модальный div, но если я помещаю форму в выходное намерение модального div, то это перестаньте работать, не выдавая ошибок на консоли ...

Это рабочий код 

<script src="https://cdn.shopify.com/s/files/1/0283/0798/0341/t/8/assets/stick-to-me.js"></script>

<!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<div id="mc_embed_signup">
<form action="https://facebook.us14.list-manage.com/subscribe/post?u=db40c343b16b0af0b777d7db4&id=2631affdd7" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate="">
    <div id="mc_embed_signup_scroll">
    <h2>Werde Teil der bonmedico Community &amp; erhalte 15 % auf Deinen ersten Einkauf!</h2>

<div class="mc-field-group">
    <input type="text" value="" name="FNAME" class="required" placeholder="Vorname" id="mce-FNAME">
</div>

<div class="mc-field-group">
    <input type="text" value="" name="LNAME" class="required" placeholder="Nachname" id="mce-LNAME">
</div>

<div class="mc-field-group">
    <input type="email" value="" name="EMAIL" class="required email" placeholder="Email-Adresse" id="mce-EMAIL">
</div>

<div class="mc-field-group input-group">
    <strong> </strong>
    <ul>
<li>
<label for="mce-group[7316]-7316-0"><input type="checkbox" value="1" name="group[7316][1]" id="mce-group[7316]-7316-0" class="required"> Ich stimme zu, Benachrichtigungen von bonmedico zu erhalten. Ich habe die <a href="https://bonmedico.com/pages/datenschutz" target="_blank">Datenschutzerklärung</a> gelesen</label>
</li>
</ul>
</div>

    <div id="mce-responses" class="clear">
        <div class="response" id="mce-error-response" style="display:none"></div>
        <div class="response" id="mce-success-response" style="display:none"></div>
    </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 type="text" name="b_db40c343b16b0af0b777d7db4_2631affdd7" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="Anmelden" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
</div>
<!--End mc_embed_signup-->

<div id="stickLayer" style="display:none;" class="stick_popup">
  <div class="stick_close" onclick="$.stick_close()">X</div>
  <div class="stick_content">
<H1>
Hello
</H1>
  </div>
</div>

<script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>

$.noConflict();
 $.stickToMe({
  layer: '#stickLayer',
  fadespeed: 400,
  trigger: ['top'],
  maxtime : 0,
  mintime : 0,
  delay: 0,
  interval: 0,
  maxamount : 1,
    cookie : false,
  bgclickclose : true,
  escclose : true,
  onleave : function (e) {},
  disableleftscroll : true  // chrome disable   
});

https://jsfiddle.net/arabtornado/5evLbpzo/6/

Однако, если я помещу почтовый код в модальное div .stick_content, проверка перестанет работать без каких-либо ошибок

https://jsfiddle.net/arabtornado/ycmjdk8u/26/

...