var/cache/dev/twig/5a/5adc3f67420368cfce6b2a8d4fedf7bd.php line 40

Open in your IDE?
  1. <?php
  3. use Twig\Environment;
  4. use Twig\Error\LoaderError;
  5. use Twig\Error\RuntimeError;
  6. use Twig\Extension\SandboxExtension;
  7. use Twig\Markup;
  8. use Twig\Sandbox\SecurityError;
  9. use Twig\Sandbox\SecurityNotAllowedTagError;
  10. use Twig\Sandbox\SecurityNotAllowedFilterError;
  11. use Twig\Sandbox\SecurityNotAllowedFunctionError;
  12. use Twig\Source;
  13. use Twig\Template;
  15. /* lidkaart/renew-membership.html.twig */
  16. class __TwigTemplate_297c34b826f797eb2d2fb17bfbf5ddc7 extends Template
  17. {
  18.     private $source;
  19.     private $macros = [];
  21.     public function __construct(Environment $env)
  22.     {
  23.         parent::__construct($env);
  25.         $this->source = $this->getSourceContext();
  27.         $this->blocks = [
  28.             'content' => [$this, 'block_content'],
  29.         ];
  30.         $this->sandbox = $this->env->getExtension('\Twig\Extension\SandboxExtension');
  31.         $this->checkSecurity();
  32.     }
  34.     protected function doGetParent(array $context)
  35.     {
  36.         // line 1
  37.         return $this->loadTemplate($this->extensions['App\Twig\Extension\WebsiteExtension']->getBaseLayout(), "lidkaart/renew-membership.html.twig", 1);
  38.     }
  40.     protected function doDisplay(array $context, array $blocks = [])
  41.     {
  42.         $macros = $this->macros;
  43.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  44.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "lidkaart/renew-membership.html.twig"));
  46.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  47.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "lidkaart/renew-membership.html.twig"));
  49.         $this->getParent($context)->display($context, array_merge($this->blocks, $blocks));
  50.         
  51.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  53.         
  54.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  56.     }
  58.     // line 3
  59.     public function block_content($context, array $blocks = [])
  60.     {
  61.         $macros = $this->macros;
  62.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  63.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "content"));
  65.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  66.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "content"));
  68.         // line 4
  69.         echo "    <div class=\"row\">
  70.         <div class=\"col-8 mx-auto\">
  71.             <h1 class=\"py-5\">";
  72.         // line 6
  73.         echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans("Nieuwe lidkaart aanmaken"), "html", null, true);
  74.         echo "</h1>
  75.             ";
  76.         // line 7
  77.         $this->env->getRuntime("Symfony\\Component\\Form\\FormRenderer")->setTheme((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 7, $this->source); })()), [0 => "bootstrap_5_layout.html.twig"], true);
  78.         // line 8
  79.         echo "
  80.             ";
  81.         // line 9
  82.         echo         $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->renderBlock($this->sandbox->ensureToStringAllowed((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 9, $this->source); })()), 9, $this->source), 'form_start', ["attr" => ["class" => "form", "id" => "membership_form"]]);
  83.         echo "
  84.             <div class=\"row\">
  85.                 <div class=\"col-lg-3\">
  86.                     ";
  87.         // line 12
  88.         echo $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock($this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 12, $this->source); })()), "club", [], "any", false, false, true, 12), 12, $this->source), 'row', ["attr" => ["required" => "required"]]);
  89.         echo "
  90.                     ";
  91.         // line 13
  92.         echo $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock($this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 13, $this->source); })()), "membershipType", [], "any", false, false, true, 13), 13, $this->source), 'row', ["attr" => ["required" => "required"]]);
  93.         echo "
  94.                 </div>
  95.                 <div class=\"col-lg-7\">
  96.                     <div class=\"p-3 m-3\" style=\"width: 18rem;\">
  97.                         <div class=\"d-flex justify-content-between\">
  98.                             <button type=\"button\" class=\"btn btn-secondary\" id=\"add_member\" disabled>";
  99.         // line 18
  100.         echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans("Lid Toevoegen"), "html", null, true);
  101.         echo "</button>
  102.                             <button type=\"submit\" class=\"btn btn-primary\" id=\"submit_button\" disabled>";
  103.         // line 19
  104.         echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans("Volgende"), "html", null, true);
  105.         echo "</button>
  106.                         </div>
  107.                     </div>
  108.                 </div>
  109.             </div>
  110.             <hr>
  111.             <div id=\"members\" class=\"row\" data-prototype=\"";
  112.         // line 25
  113.         echo twig_escape_filter($this->env, $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock($this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 25, $this->source); })()), "members", [], "any", false, false, true, 25), "vars", [], "any", false, false, true, 25), "prototype", [], "any", false, false, true, 25), 25, $this->source), 'widget'));
  114.         echo "\">
  115.                 ";
  116.         // line 26
  117.         $context['_parent'] = $context;
  118.         $context['_seq'] = twig_ensure_traversable(twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 26, $this->source); })()), "members", [], "any", false, false, true, 26));
  119.         $context['loop'] = [
  120.           'parent' => $context['_parent'],
  121.           'index0' => 0,
  122.           'index'  => 1,
  123.           'first'  => true,
  124.         ];
  125.         if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
  126.             $length = count($context['_seq']);
  127.             $context['loop']['revindex0'] = $length - 1;
  128.             $context['loop']['revindex'] = $length;
  129.             $context['loop']['length'] = $length;
  130.             $context['loop']['last'] = 1 === $length;
  131.         }
  132.         foreach ($context['_seq'] as $context["_key"] => $context["MembershipFormType"]) {
  133.             // line 27
  134.             echo "                    <div class=\"col-lg-6 mb-4\" id=\"member_";
  135.             echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, $context["loop"], "index", [], "any", false, false, true, 27), 27, $this->source), "html", null, true);
  136.             echo "\">
  137.                         ";
  138.             // line 28
  139.             echo $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock($this->sandbox->ensureToStringAllowed($context["MembershipFormType"], 28, $this->source), 'row');
  140.             echo "
  141.                         <button type=\"button\" class=\"btn btn-danger delete-member\" data-index=\"";
  142.             // line 29
  143.             echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, $context["loop"], "index", [], "any", false, false, true, 29), 29, $this->source), "html", null, true);
  144.             echo "\">
  145.                             ";
  146.             // line 30
  147.             echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans("Remove Member"), "html", null, true);
  148.             echo "
  149.                         </button>
  150.                     </div>
  151.                 ";
  152.             ++$context['loop']['index0'];
  153.             ++$context['loop']['index'];
  154.             $context['loop']['first'] = false;
  155.             if (isset($context['loop']['length'])) {
  156.                 --$context['loop']['revindex0'];
  157.                 --$context['loop']['revindex'];
  158.                 $context['loop']['last'] = 0 === $context['loop']['revindex0'];
  159.             }
  160.         }
  161.         $_parent = $context['_parent'];
  162.         unset($context['_seq'], $context['_iterated'], $context['_key'], $context['MembershipFormType'], $context['_parent'], $context['loop']);
  163.         $context = array_intersect_key($context, $_parent) + $_parent;
  164.         // line 34
  165.         echo "            </div>
  166.             ";
  167.         // line 35
  168.         echo         $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->renderBlock($this->sandbox->ensureToStringAllowed((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 35, $this->source); })()), 35, $this->source), 'form_end');
  169.         echo "
  170.         </div>
  171.     </div>
  172.     <script>
  174.         const sportChoices = {
  175.             'sailing': [
  176.                 'Zwaardboten',
  177.                 'Kitesurfen',
  178.                 'Yachting',
  179.             ],
  180.             'surfing': [
  181.                 'Windsurfen',
  182.                 'SUP',
  183.                 'Wingfoil',
  184.                 'Kitesurfen',
  185.             ]
  186.         }
  188.         function repopulateSportFields() {
  189.             const clubValue = \$('#";
  190.         // line 55
  191.         echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 55, $this->source); })()), "club", [], "any", false, false, true, 55), "vars", [], "any", false, false, true, 55), "id", [], "any", false, false, true, 55), 55, $this->source), "html", null, true);
  192.         echo "').val();
  193.             const sportOptions = sportChoices[clubValue] || [];
  195.             // Iterate over all sport1 and sport2 selectors
  196.             \$('.sport1_selector').each(function(index, sport1Selector) {
  197.                 const \$sport1Selector = \$(sport1Selector);
  198.                 const currentSport1Selection = \$sport1Selector.val();
  200.                 // Reset the field options
  201.                 \$sport1Selector.empty();
  203.                 // Appending the default options
  204.                 sportOptions.forEach((element) => {
  205.                     const optionValue = element.toLowerCase();
  206.                     \$sport1Selector.append(\$('<option>', {value: optionValue}).text(element));
  207.                 });
  209.                 // Reapply the previous selection if it is still valid
  210.                 if (sportOptions.map(e => e.toLowerCase()).includes(currentSport1Selection)) {
  211.                     \$sport1Selector.val(currentSport1Selection);
  212.                 }
  213.             });
  215.             \$('.sport2_selector').each(function(index, sport2Selector) {
  216.                 const \$sport2Selector = \$(sport2Selector);
  217.                 const currentSport2Selection = \$sport2Selector.val();
  219.                 // Reset the field options
  220.                 \$sport2Selector.empty();
  222.                 // Setting the n.v.t. on the sport2 selector
  223.                 \$sport2Selector.append(\$('<option>', {value: 'N.V.T'}).text('N.V.T.'));
  225.                 // Appending the default options
  226.                 sportOptions.forEach((element) => {
  227.                     const optionValue = element.toLowerCase();
  228.                     \$sport2Selector.append(\$('<option>', {value: optionValue}).text(element));
  229.                 });
  231.                 // Reapply the previous selection if it is still valid
  232.                 if (sportOptions.map(e => e.toLowerCase()).includes(currentSport2Selection)) {
  233.                     \$sport2Selector.val(currentSport2Selection);
  234.                 } else {
  235.                     \$sport2Selector.val('N.V.T');
  236.                 }
  237.             });
  238.         }
  240.         // Function to enable/disable buttons based on form completion
  241.         function toggleButtons() {
  242.             const clubFilled = document.querySelector('#";
  243.         // line 105
  244.         echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 105, $this->source); })()), "club", [], "any", false, false, true, 105), "vars", [], "any", false, false, true, 105), "id", [], "any", false, false, true, 105), 105, $this->source), "html", null, true);
  245.         echo "').value.trim() !== '';
  246.             const membershipType = document.querySelector('#";
  247.         // line 106
  248.         echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 106, $this->source); })()), "membershipType", [], "any", false, false, true, 106), "vars", [], "any", false, false, true, 106), "id", [], "any", false, false, true, 106), 106, $this->source), "html", null, true);
  249.         echo "').value.trim();
  250.             const addParticipantButton = document.getElementById('add_member');
  251.             const submitButton = document.getElementById('submit_button');
  252.             const membersCount = document.querySelectorAll('#members .mb-4').length;
  254.             addParticipantButton.disabled = !(clubFilled && validateMembershipType(membershipType, membersCount));
  255.             submitButton.disabled = !(clubFilled && membershipType !== '' && membersCount >= 1);
  256.         }
  258.         // Validate membership type and number of members based on selected type
  259.         function validateMembershipType(type, count) {
  260.             const allowedMembers = {
  261.                 'jeugdlid': 1, // Limit for Jeugdlid - 22 j
  262.                 'volwassen': 1, // Limit for Volwassen
  263.                 'familie': 6, // Limit for Volwassen
  264.             };
  266.             if (type in allowedMembers) {
  267.                 if (count >= allowedMembers[type]) {
  268.                     return false;
  269.                 }
  270.             }
  271.             return true;
  272.         }
  274.         // Add Participant button functionality
  275.         document.getElementById('add_member').addEventListener('click', function () {
  276.             const collectionHolder = document.getElementById('members');
  277.             const prototype = collectionHolder.getAttribute('data-prototype');
  278.             const membershipType = document.querySelector('#";
  279.         // line 135
  280.         echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 135, $this->source); })()), "membershipType", [], "any", false, false, true, 135), "vars", [], "any", false, false, true, 135), "id", [], "any", false, false, true, 135), 135, $this->source), "html", null, true);
  281.         echo "').value.trim();
  282.             const membersCount = document.querySelectorAll('#members .mb-4').length;
  284.             if (!validateMembershipType(membershipType, membersCount)) {
  285.                 return;
  286.             }
  288.             const index = collectionHolder.children.length;
  289.             const newForm = prototype.replace(/__name__/g, index);
  290.             const tempDiv = document.createElement('div');
  291.             tempDiv.innerHTML = newForm.trim();
  292.             const element = tempDiv.firstChild;
  293.             element.classList.add('col-lg-3', 'mb-4');
  294.             collectionHolder.appendChild(element);
  295.             const deleteButton = document.createElement('button');
  296.             deleteButton.setAttribute('type', 'button');
  297.             deleteButton.setAttribute('class', 'btn btn-danger delete-member my-2');
  298.             deleteButton.setAttribute('data-index', index);
  299.             deleteButton.innerHTML = '<i class=\"fa-solid fa-trash text-white\"></i>';
  300.             deleteButton.addEventListener('click', function () {
  301.                 if (confirm(\"";
  302.         // line 155
  303.         echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans("Are you sure you want to remove this member?"), "html", null, true);
  304.         echo "\")) {
  305.                     element.parentNode.removeChild(element);
  306.                     toggleButtons(); // Recheck form completion on member removal
  307.                 }
  308.             });
  309.             element.prepend(deleteButton);
  310.             toggleButtons(); // Recheck form completion on member addition
  313.             repopulateSportFields(); // Repopulate the sport fields based on the club entry
  315.         });
  317.         // Client-side form validation and button toggling
  318.         const form = document.getElementById('membership_form');
  319.         form.addEventListener('submit', function (event) {
  320.             if (!form.checkValidity()) {
  321.                 event.preventDefault();
  322.                 event.stopPropagation();
  323.             }
  324.             form.classList.add('was-validated');
  325.         });
  327.         // Control buttons activation based on input changes
  328.         document.querySelectorAll('input, select').forEach(input => {
  329.             input.addEventListener('input', toggleButtons);
  330.         });
  332.         toggleButtons(); // Initially check form completion on page load
  336.         \$('#";
  337.         // line 187
  338.         echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 187, $this->source); })()), "club", [], "any", false, false, true, 187), "vars", [], "any", false, false, true, 187), "id", [], "any", false, false, true, 187), 187, $this->source), "html", null, true);
  339.         echo "').on('change', function() {
  340.             repopulateSportFields(); // Repopulate the sport fields
  341.         });
  343.     </script>
  345. ";
  346.         
  347.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  349.         
  350.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  352.     }
  354.     public function getTemplateName()
  355.     {
  356.         return "lidkaart/renew-membership.html.twig";
  357.     }
  359.     public function isTraitable()
  360.     {
  361.         return false;
  362.     }
  364.     public function getDebugInfo()
  365.     {
  366.         return array (  338 => 187,  303 => 155,  280 => 135,  248 => 106,  244 => 105,  191 => 55,  168 => 35,  165 => 34,  147 => 30,  143 => 29,  139 => 28,  134 => 27,  117 => 26,  113 => 25,  104 => 19,  100 => 18,  92 => 13,  88 => 12,  82 => 9,  79 => 8,  77 => 7,  73 => 6,  69 => 4,  59 => 3,  37 => 1,);
  367.     }
  369.     public function getSourceContext()
  370.     {
  371.         return new Source("{% extends base_layout() %}
  373. {% block content %}
  374.     <div class=\"row\">
  375.         <div class=\"col-8 mx-auto\">
  376.             <h1 class=\"py-5\">{{ 'Nieuwe lidkaart aanmaken'|trans }}</h1>
  377.             {% form_theme form 'bootstrap_5_layout.html.twig' %}
  379.             {{ form_start(form, {'attr': {'class': 'form', 'id': 'membership_form'}}) }}
  380.             <div class=\"row\">
  381.                 <div class=\"col-lg-3\">
  382.                     {{ form_row(form.club, {'attr': {'required': 'required'}}) }}
  383.                     {{ form_row(form.membershipType, {'attr': {'required': 'required'}}) }}
  384.                 </div>
  385.                 <div class=\"col-lg-7\">
  386.                     <div class=\"p-3 m-3\" style=\"width: 18rem;\">
  387.                         <div class=\"d-flex justify-content-between\">
  388.                             <button type=\"button\" class=\"btn btn-secondary\" id=\"add_member\" disabled>{{ 'Lid Toevoegen'|trans }}</button>
  389.                             <button type=\"submit\" class=\"btn btn-primary\" id=\"submit_button\" disabled>{{ 'Volgende'|trans }}</button>
  390.                         </div>
  391.                     </div>
  392.                 </div>
  393.             </div>
  394.             <hr>
  395.             <div id=\"members\" class=\"row\" data-prototype=\"{{ form_widget(form.members.vars.prototype)|e }}\">
  396.                 {% for MembershipFormType in form.members %}
  397.                     <div class=\"col-lg-6 mb-4\" id=\"member_{{ loop.index }}\">
  398.                         {{ form_row(MembershipFormType) }}
  399.                         <button type=\"button\" class=\"btn btn-danger delete-member\" data-index=\"{{ loop.index }}\">
  400.                             {{ 'Remove Member'|trans }}
  401.                         </button>
  402.                     </div>
  403.                 {% endfor %}
  404.             </div>
  405.             {{ form_end(form) }}
  406.         </div>
  407.     </div>
  408.     <script>
  410.         const sportChoices = {
  411.             'sailing': [
  412.                 'Zwaardboten',
  413.                 'Kitesurfen',
  414.                 'Yachting',
  415.             ],
  416.             'surfing': [
  417.                 'Windsurfen',
  418.                 'SUP',
  419.                 'Wingfoil',
  420.                 'Kitesurfen',
  421.             ]
  422.         }
  424.         function repopulateSportFields() {
  425.             const clubValue = \$('#{{ form.club.vars.id }}').val();
  426.             const sportOptions = sportChoices[clubValue] || [];
  428.             // Iterate over all sport1 and sport2 selectors
  429.             \$('.sport1_selector').each(function(index, sport1Selector) {
  430.                 const \$sport1Selector = \$(sport1Selector);
  431.                 const currentSport1Selection = \$sport1Selector.val();
  433.                 // Reset the field options
  434.                 \$sport1Selector.empty();
  436.                 // Appending the default options
  437.                 sportOptions.forEach((element) => {
  438.                     const optionValue = element.toLowerCase();
  439.                     \$sport1Selector.append(\$('<option>', {value: optionValue}).text(element));
  440.                 });
  442.                 // Reapply the previous selection if it is still valid
  443.                 if (sportOptions.map(e => e.toLowerCase()).includes(currentSport1Selection)) {
  444.                     \$sport1Selector.val(currentSport1Selection);
  445.                 }
  446.             });
  448.             \$('.sport2_selector').each(function(index, sport2Selector) {
  449.                 const \$sport2Selector = \$(sport2Selector);
  450.                 const currentSport2Selection = \$sport2Selector.val();
  452.                 // Reset the field options
  453.                 \$sport2Selector.empty();
  455.                 // Setting the n.v.t. on the sport2 selector
  456.                 \$sport2Selector.append(\$('<option>', {value: 'N.V.T'}).text('N.V.T.'));
  458.                 // Appending the default options
  459.                 sportOptions.forEach((element) => {
  460.                     const optionValue = element.toLowerCase();
  461.                     \$sport2Selector.append(\$('<option>', {value: optionValue}).text(element));
  462.                 });
  464.                 // Reapply the previous selection if it is still valid
  465.                 if (sportOptions.map(e => e.toLowerCase()).includes(currentSport2Selection)) {
  466.                     \$sport2Selector.val(currentSport2Selection);
  467.                 } else {
  468.                     \$sport2Selector.val('N.V.T');
  469.                 }
  470.             });
  471.         }
  473.         // Function to enable/disable buttons based on form completion
  474.         function toggleButtons() {
  475.             const clubFilled = document.querySelector('#{{ form.club.vars.id }}').value.trim() !== '';
  476.             const membershipType = document.querySelector('#{{ form.membershipType.vars.id }}').value.trim();
  477.             const addParticipantButton = document.getElementById('add_member');
  478.             const submitButton = document.getElementById('submit_button');
  479.             const membersCount = document.querySelectorAll('#members .mb-4').length;
  481.             addParticipantButton.disabled = !(clubFilled && validateMembershipType(membershipType, membersCount));
  482.             submitButton.disabled = !(clubFilled && membershipType !== '' && membersCount >= 1);
  483.         }
  485.         // Validate membership type and number of members based on selected type
  486.         function validateMembershipType(type, count) {
  487.             const allowedMembers = {
  488.                 'jeugdlid': 1, // Limit for Jeugdlid - 22 j
  489.                 'volwassen': 1, // Limit for Volwassen
  490.                 'familie': 6, // Limit for Volwassen
  491.             };
  493.             if (type in allowedMembers) {
  494.                 if (count >= allowedMembers[type]) {
  495.                     return false;
  496.                 }
  497.             }
  498.             return true;
  499.         }
  501.         // Add Participant button functionality
  502.         document.getElementById('add_member').addEventListener('click', function () {
  503.             const collectionHolder = document.getElementById('members');
  504.             const prototype = collectionHolder.getAttribute('data-prototype');
  505.             const membershipType = document.querySelector('#{{ form.membershipType.vars.id }}').value.trim();
  506.             const membersCount = document.querySelectorAll('#members .mb-4').length;
  508.             if (!validateMembershipType(membershipType, membersCount)) {
  509.                 return;
  510.             }
  512.             const index = collectionHolder.children.length;
  513.             const newForm = prototype.replace(/__name__/g, index);
  514.             const tempDiv = document.createElement('div');
  515.             tempDiv.innerHTML = newForm.trim();
  516.             const element = tempDiv.firstChild;
  517.             element.classList.add('col-lg-3', 'mb-4');
  518.             collectionHolder.appendChild(element);
  519.             const deleteButton = document.createElement('button');
  520.             deleteButton.setAttribute('type', 'button');
  521.             deleteButton.setAttribute('class', 'btn btn-danger delete-member my-2');
  522.             deleteButton.setAttribute('data-index', index);
  523.             deleteButton.innerHTML = '<i class=\"fa-solid fa-trash text-white\"></i>';
  524.             deleteButton.addEventListener('click', function () {
  525.                 if (confirm(\"{{ 'Are you sure you want to remove this member?'|trans }}\")) {
  526.                     element.parentNode.removeChild(element);
  527.                     toggleButtons(); // Recheck form completion on member removal
  528.                 }
  529.             });
  530.             element.prepend(deleteButton);
  531.             toggleButtons(); // Recheck form completion on member addition
  534.             repopulateSportFields(); // Repopulate the sport fields based on the club entry
  536.         });
  538.         // Client-side form validation and button toggling
  539.         const form = document.getElementById('membership_form');
  540.         form.addEventListener('submit', function (event) {
  541.             if (!form.checkValidity()) {
  542.                 event.preventDefault();
  543.                 event.stopPropagation();
  544.             }
  545.             form.classList.add('was-validated');
  546.         });
  548.         // Control buttons activation based on input changes
  549.         document.querySelectorAll('input, select').forEach(input => {
  550.             input.addEventListener('input', toggleButtons);
  551.         });
  553.         toggleButtons(); // Initially check form completion on page load
  557.         \$('#{{ form.club.vars.id }}').on('change', function() {
  558.             repopulateSportFields(); // Repopulate the sport fields
  559.         });
  561.     </script>
  563. {% endblock %}
  564. ", "lidkaart/renew-membership.html.twig", "/var/www/clients/client2/web45/web/pc/templates/lidkaart/renew-membership.html.twig");
  565.     }
  566.     
  567.     public function checkSecurity()
  568.     {
  569.         static $tags = array("form_theme" => 7, "for" => 26);
  570.         static $filters = array("escape" => 6, "trans" => 6, "e" => 25);
  571.         static $functions = array("form_start" => 9, "form_row" => 12, "form_widget" => 25, "form_end" => 35, "base_layout" => 1);
  573.         try {
  574.             $this->sandbox->checkSecurity(
  575.                 ['form_theme', 'for'],
  576.                 ['escape', 'trans', 'e'],
  577.                 ['form_start', 'form_row', 'form_widget', 'form_end', 'base_layout']
  578.             );
  579.         } catch (SecurityError $e) {
  580.             $e->setSourceContext($this->source);
  582.             if ($e instanceof SecurityNotAllowedTagError && isset($tags[$e->getTagName()])) {
  583.                 $e->setTemplateLine($tags[$e->getTagName()]);
  584.             } elseif ($e instanceof SecurityNotAllowedFilterError && isset($filters[$e->getFilterName()])) {
  585.                 $e->setTemplateLine($filters[$e->getFilterName()]);
  586.             } elseif ($e instanceof SecurityNotAllowedFunctionError && isset($functions[$e->getFunctionName()])) {
  587.                 $e->setTemplateLine($functions[$e->getFunctionName()]);
  588.             }
  590.             throw $e;
  591.         }
  593.     }
  594. }