Stworzyłem prostą stronę Delightart. Obecnie integruję ją z Mailchimpem. Stworzyłem dwa modale, pierwszy z nich służy do zapisania się na newsletter, drugi modal wyświetla podziękowanie za dodanie się do newslettera. Problem stanowi sytuacja po wyświetleniu się popup'a z podziękowaniem. Klient zostaje niepotrzebnie przekierowany do ponownego wprowadzenia danych w formularzu mailchimp. Jak dokładnie to wygląda, możecie sprawdzić na stronie. Chciałbym uniknąć powyższej sytuacji. Cel końcowy: po wyświetleniu się modala z podziękowaniem, adres email zostaje przesłany do Mailchimpa i dodany do bazy maili, po 3s modal z podziękowaniem znika a użytkownik pozostaje nadal na stronie, bez żadnych przekierowań. Śledzę kilka wątków w tym temacie na Stackoverflow ale żaden nie działa. Mam na myśli obejście tej sytuacji Ajaxem i nasłuchiwanie eventów by uniemożliwić przekierowanie do mailchimpa.
Modal nr 1
<!-- Modal Newsletter Start-->
<div id="myModal" class="modal fade">
<div class="modal-dialog modal-newsletter">
<div class="modal-content">
<form action="https://delightart.us2.list-manage.com/subscribe/post?u=ac42cd35562327cc088d0a4ce&id=399e8a2cc7" class="myform" method="post" novalidate>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span>×</span></button>
</div>
<div class="modal-body text-center">
<h4>Subscribe to our newsletter</h4>
<p>Signup to our weekly newsletters to get the latest news, updates and amazing offers!</p>
</div>
<div class="input-group">
<input type="email" class="form-control" id="emapleInputEmail1" placeholder="Enter your email..." required>
<input type="submit" class="btn btn-primary" value="Subscribe">
</div>
</form>
</div>
</div>
</div>
Modal nr 2
<!--Modal Thank You Start-->
<div id="myModal1" class="modal fade">
<div class="modal-dialog modal-sm">
<!--Modal Content-->
<div class="modal-content">
<div class=”modal-body”>
<button type="button" class="close" data-dismiss="modal">×</button>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 130.2 130.2">
<circle class="path circle" fill="none" stroke="#73AF55" stroke-width="6" stroke-miterlimit="10" cx="65.1" cy="65.1" r="62.1" />
<polyline class="path check" fill="none" stroke="#73AF55" stroke-width="6" stroke-linecap="round" stroke-miterlimit="10" points="100.2,40.2 51.5,88.8 29.8,67.5" />
</svg>
<p class="text-center">Thank you!!</p>
</div>
</div>
</div>
</div>