themes/BootstrapTheme/templates/bundles/SyliusShopBundle/Homepage/_newsletter.html.twig line 1

Open in your IDE?
  1. {% import '@SyliusShop/Common/Macro/sectionHeaders.html.twig' as headers %}
  2. <div class="d-flex flex-column">
  3.     {% if app.user %}
  4.         <div class="bloc-newsletter px-md-2 px-3 bg-gradient-orange">
  5.             <div class="max-container-4 px-0 py-perso-news ">
  6.                 <div class="text-center row no-gutters align-items-center">
  7.                     <div class="col-md-auto  text-md-left text-center">
  8.                         <div class="title-big-regular text-white mb-md-0 line-h-100 fontbold-mobile">{{'app.homepage.the_newsletter'|trans}}</div>
  9.                         <div class="txt-newsletter  text-white fontsize-normal">{{'app.homepage.newsletter_description'|trans}}</div>
  10.                     </div>
  11.                     <div class="pl-md-3 col-md pl-lg-5 pt-md-0 pt-3">
  12.                         <div class="form-newsletter">
  13.                             <form method="post" action="{{ path('app_shop_ajax_newsletter_registration') }}" id="newsletter-form">
  14.                                 <input class="adresse-newsletter fontsize-mobile-text text-regular-onlg" name="adressenewsletter" id="adressenewsletter" value="{{'app.homepage.email_adressmail'|trans}}..." onkeypress="" onfocus="if (this.value==this.defaultValue) this.value = ''"  onblur="if (this.value=='') this.value = this.defaultValue;" type="email">
  15.                                 <button class="news-button" type="submit"><span>{{'app.homepage.ok'|trans}}</span></button>
  16.                             </form>
  17.                         </div>
  18.                         <div id="newsletter_success" class="newsletter-msg success" style="display: none;">{{ 'app.newsletter.registration_success'|trans }}</div>
  19.                         <div id="newsletter_error" class="newsletter-msg error" style="display: none;">{{ 'app.newsletter.registration_error'|trans }}</div>
  20.                         <div id="newsletter_error_no_email" class="newsletter-msg error" style="display: none;">{{ 'app.newsletter.no_email_error'|trans }}</div>
  21.                     </div>
  22.                 </div>
  23.             </div>
  24.         </div>
  25.     {% endif %}
  26. </div>
  27. <script>
  28.     let form = document.getElementById('newsletter-form');
  29.     if (form) {
  30.         form.addEventListener('submit', function (e) {
  31.             e.preventDefault();
  32.             data = {email: document.getElementById('adressenewsletter').value}
  33.             $.ajax({
  34.                 type: 'POST',
  35.                 url: form.getAttribute('action'),
  36.                 data: data,
  37.                 success(response) {
  38.                     console.log(response)
  39.                     if (response.code === 200) {
  40.                         document.getElementById('newsletter_success').style.display = "block";
  41.                     }
  42.                     else if (response.code === 500) {
  43.                         if (response.error && response.error === "no_email")
  44.                             document.getElementById('newsletter_error_no_email').style.display = "block";
  45.                         else
  46.                             document.getElementById('newsletter_error').style.display = "block";
  47.                     }
  48.                 },
  49.             });
  50.         })
  51.     }
  52. </script>