src/views/join_our_mailing.twig line 1

Open in your IDE?
  1. <section class="section section--issuesthemes" style="padding: 2rem 0 !important;">
  2.     <div class="container-fluid">
  3.         <div class="row">
  4.             <div class="col-xl-11 col-lg-11 col-md-11 col-sm-12 m-auto">
  5.                 <div class="row">
  6.                     <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6">
  7.                         <h5 style="font-weight: bold;">{{ 'mailing.mailtext'|trans }}</h5>
  8.                      
  9.                     </div>
  10.                     <div class="col-xl-5 col-lg-5 col-md-5 col-sm-6">
  11.                    
  12.                         <div class="input-group mb-3" style="justify-content: center;align-items: center;height: 100%;">
  13.                             <input type="email" name="email" class="form-control" placeholder="{{ 'mailing.placeholder'|trans }}" style="
  14.                             border-right: 0px;border-radius: 25px 0px 0px 25px;height: 40px;font-size: 14px;" id="email">
  15.                             <button class="btn btn-warning px-4" onclick="mail_subscribe()" onsubmit="return validateRegisterForm()" type="submit" style="height: 40px;border-radius: 25px 25px 25px 25px;font-size: 14px;position: relative;left: -15px;">{{ 'mailing.mailbutton'|trans }}</button>
  16.                           </div>
  17.                       
  18.                     </div>
  19. {#<div class="col-xl-3 col-lg-3 col-md-3 col-sm-6">
  20.                         <ul class="subc_ul">
  21.                             <li>
  22.                                 <a href="#">
  23.                                     <i class="fa-brands fa-facebook"></i>
  24.                                 </a>
  25.                             </li>
  26.                             <li>
  27.                                 <a href="#">
  28.                                     <i class="fa-brands fa-twitter"></i>
  29.                                 </a>
  30.                             </li>
  31.                             <li>
  32.                                 <a href="#">
  33.                                     <i class="fa-brands fa-pinterest-p"></i>
  34.                                 </a>
  35.                             </li>
  36.                             <li>
  37.                                 <a href="#">
  38.                                     <i class="fa-brands fa-instagram"></i>
  39.                                 </a>
  40.                             </li>
  41.                         </ul>
  42.                     </div>#}
  43.                 </div>
  44.             </div>
  45.         </div>
  46.     </div>
  47. </section>
  49. <script>
  50. function mail_subscribe() {
  51.     if (validateRegisterForm()) {
  52.             const email = document.getElementById('email').value;
  53.         //    alert(email);
  54.             
  55.             $.ajax({
  56.                 url: '{{ path('mail_save') }}',
  57.                 type: 'POST',
  58.                 data: JSON.stringify({ email : email }),
  59.                 contentType: 'application/json',
  60.                 success: function(data) {
  61.                     if (data.success == true) {
  62.                         alert(data.message);
  63.                         $('#email').val('');
  64.                     } else{
  65.                         alert(data.message);
  66.                         $('#email').val('');
  67.                     }
  68.                 }
  69.             });
  70.     }
  71. }
  73. function validateRegisterForm() {
  74.             
  75.     const email = document.getElementById('email').value;
  76.     if (!validateEmail(email)) {
  77.         alert('Please enter a valid email address.');
  78.         return false;
  79.     }
  80.     return true;
  81. }
  83. function validateEmail(email) {
  84.     const re = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  85.     return re.test(String(email).toLowerCase());
  86. }
  88.         
  89. </script>