templates/front/devenir.html.twig line 1

  1. {% extends 'base.html.twig' %}
  2. {% block title %}Devenez bénévole - Croix Rouge française{% endblock %}
  3. {% block body %}
  4. <div class="bg-light mb-3">
  5.     <div class="container">
  6.         <div class="row block-heading-1 aos-init aos-animate py-3">
  7.             <h2>Inscrivez-vous</h2>
  8.             <p>Commencez dès à présent votre inscription pour devenir bénévole à la Croix-Rouge française</p>
  9.         </div>
  10.     </div>
  11. </div>
  12. <div class="container mb-5">
  13.     <div class="row">
  14.         <p>À l'issue de votre inscription, vous recevrez par mail un lien unique à conserver pour interagir sur votre dossier.</p>
  15.         <p class="fst-italic">Les éléments avec un astérisque sont obligatoires.</p>
  16.         <form name="formsoc" action="" id="formdevenir" method="post" enctype="multipart/form-data">
  17.             <div class="form-group row mb-2">
  18.                 <label for="inputville" class="col-sm-4 col-form-label bg-light">Ville de résidence*</label>
  19.                 <div class="col-sm-6">
  20.                     <input type="text" id="ville" class="form-control required" name="ville" required="" placeholder="Votre ville de résidence" value="{{ ville }}">
  21.                     <div id="check_ville"></div>
  22.                 </div>
  23.             </div>
  24.             <div class="form-group row mb-2">
  25.                 <label for="inputtype" class="col-sm-4 col-form-label bg-light" id="crf">Civilité*</label>
  26.                 <div class="col-sm-6">
  27.                     <select id="sexe" name="civilite" class="form-control required" required="">
  28.                         <option value="">Choisissez...</option>
  29.                         <option value="F"{% if civilite == 'F' %} selected{% endif %}>Madame/Mademoiselle</option>
  30.                         <option value="H"{% if civilite == 'H' %} selected{% endif %}>Monsieur</option>
  31.                     </select>
  32.                 </div>
  33.             </div>
  34.             <div class="form-group row mb-2">
  35.                 <label for="inputnom" class="col-sm-4 col-form-label bg-light">Nom*</label>
  36.                 <div class="col-sm-6">
  37.                     <input type="text" class="form-control required" id="inputNom" name="nom" required="" value="{{ nom }}" placeholder="Votre nom">
  38.                 </div>
  39.             </div>
  40.             <div class="form-group row mb-2">
  41.                 <label for="inputprenom" class="col-sm-4 col-form-label bg-light">Prénom*</label>
  42.                 <div class="col-sm-6">
  43.                     <input type="text" class="form-control required" id="inputPrenom" name="prenom" required="" value="{{ prenom }}" placeholder="Votre prénom">
  44.                 </div>
  45.             </div>
  46.             <div class="form-group row mb-2">
  47.                 <label for="inputtype" class="col-sm-4 col-form-label bg-light" id="crf">Avez-vous déjà fait partie de la Croix Rouge française ?</label>
  48.                 <div class="col-sm-6">
  49.                     <select id="type_deva" name="type_deva" class="form-control" required="">
  50.                         <option value="">Choisissez...</option>
  51.                         <option value="Nouveau"{% if type_deva == 'Nouveau' %} selected{% endif %}>Non</option>
  52.                         <option value="Mutation"{% if type_deva == 'Mutation' %} selected{% endif %}>J'en fais toujours partie</option>
  53.                         <option value="Réactivation"{% if type_deva == 'Réactivation' %} selected{% endif %}>Oui mais je ne suis plus</option>
  54.                     </select>
  55.                 </div>
  56.             </div>
  57.             <div class="form-group row mb-2" id="lenivol"{% if type_deva != 'Mutation' and type_deva != 'Réactivation' %}style="display: none;"{% endif %}>
  58.                 <label for="inputnom" class="col-sm-4 col-form-label bg-light" id="txtnivol">Votre numéro de Nivol</label>
  59.                 <div class="col-sm-6" id="divnivol">
  60.                     <input type="text" class="form-control" name="nivol" value="{{ nivol }}" placeholder="Votre NIVOL">
  61.                 </div>
  62.             </div>
  63.             <div class="form-group row mb-2">
  64.                 <label for="inputnom" class="col-sm-4 col-form-label bg-light">Date de naissance*</label>
  65.                 <div class="col-sm-6">
  66.                     <input type="text" class="form-control required" id="birth" value="{{ birth }}" name="birth" required="" maxlength="10">
  67.                     <div id="errordate" class="error-message"></div>
  68.                 </div>
  69.             </div>
  70.             <div class="form-group row mb-2">
  71.                 <label for="inputEmail" class="col-sm-4 col-form-label bg-light">Email*</label>
  72.                 <div class="col-sm-6">
  73.                     <input type="email" class="form-control required" id="inputEmail3" value="{{ email }}" required="" name="email">
  74.                 </div>
  75.             </div>
  76.             <div class="form-group row mb-2">
  77.                 <label for="inputtel" class="col-sm-4 col-form-label bg-light">Tél.*</label>
  78.                 <div class="col-sm-6">
  79.                     <input type="text" class="form-control required" id="tel" name="tel" value="{{ tel }}">
  80.                 </div>
  81.             </div>
  82.             <div class="form-group row mb-2">
  83.                 <label for="inputprof" class="col-sm-4 col-form-label bg-light">Profession</label>
  84.                 <div class="col-sm-6">
  85.                     <input type="text" class="form-control" id="inputProf" name="profession" value="{{ profession }}">
  86.                 </div>
  87.             </div>
  88.             {% if secure is defined and secure == 'ko' %}
  89.             <div class="form-group row mb-2">
  90.                 <label for="" class="col-sm-4 col-form-label"></label>
  91.                 <div class="col-sm-6 text-danger">
  92.                     Une erreur de sécurité est survenue. Veuillez rééssayer.
  93.                 </div>
  94.             </div>
  95.             {% endif %}
  96.             <div class="form-group row">
  97.                 <label for="inputvalide" class="col-sm-4 col-form-label" style="">&nbsp;</label>
  98.                 <div class="col-sm-6">
  99.                     <button class="g-recaptcha btn btn-rouge"
  100.                     data-sitekey="6LdVr70kAAAAALD6WteZmF08lk3HR9jvEEi9aTeh"
  101.                     data-callback='onSubmit'
  102.                     data-action='submit'>Valider</button>
  103.                 </div>
  104.             </div>
  105.         </form>
  106.     </div>
  107. </div>
  108. {% endblock %}
  109. {% block stylesheets %}
  110.      {{ parent() }}
  111.     {{ encore_entry_link_tags('css/phonelib') }}
  112. {% endblock stylesheets %}
  113. {% block javascript %}
  114.     {{ parent() }}
  115.     <script>
  116.     function onSubmit(token) {
  117.         document.dispatchEvent(new Event("formsent"));
  118.     }
  119.     </script>
  120. {% endblock %}
  121. {% block javascripts %}
  122.     {{ parent() }}
  123.     {{ encore_entry_script_tags('js/inscription') }}
  124. {% endblock %}