{% extends "custom_field.tpl.html" %}
<!-- $Id: custom_field_list.tpl.html,v 1.1 2026/03/16 13:05:15 rtigero Exp $ -->

{% block field %}
<div id="div_{{ custom_field.NAME }}" class="pmb-custom-field-input-group">
    {% for value in custom_field.VALUES %}
        {% block radio_display %}
            <!-- Affichage en boutons radio -->
            {% if custom_field.CHECKBOX == "yes" and custom_field.MULTIPLE == "no" %}
                {% for option in custom_field.OPTIONS %}
                    <label for="{{ custom_field.NAME }}_{{ option.value }}" class="pmb-label">{{ option.lib }}</label>
                    <input id="{{ custom_field.NAME }}_{{ option.value }}" type="radio" name="{{ custom_field.NAME }}[]" {% if value == option.value %}checked{% endif %} value="{{ option.value }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
                {% endfor %}
            {% endif %}
        {% endblock %}

        {% block checkbox_display %}
            <!-- Affichage en checkboxes -->
            {% if custom_field.CHECKBOX == "yes" and custom_field.MULTIPLE == "yes" %}
                {% for option in custom_field.OPTIONS %}
                    <input id="{{ custom_field.NAME }}_{{ option.value }}" type="checkbox" name="{{ custom_field.NAME }}[]" {% if value | count option.value %}checked=""{% endif %} value="{{ option.value }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
                    <label for="{{ custom_field.NAME }}_{{ option.value }}">{{ option.lib }}</label>
                {% endfor %}
            {% endif %}
        {% endblock %}

        {% block authority_display %}
            <!-- Affichage en sélecteur d'autorité -->
            {% if custom_field.AUTORITE == "yes" %}
                <input type="text" class="saisie-50emr pmb-input" id="f_{{ custom_field.NAME }}_{{ loop.counter0 }}" completion="perso_{{ custom_field.PREFIX }}" persofield="{{ custom_field.NAME }}" autfield="{{ custom_field.NAME }}_{{ loop.counter0 }}" name="f_{{ custom_field.NAME }}[]" value="{{ value.lib }}" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error" autocomplete="off">
                <button type="button" id="" name="" class="bouton" onclick="this.form.f_{{ custom_field.NAME }}_{{ loop.counter0 }}.value=''; this.form.{{ custom_field.NAME }}_{{ loop.counter0 }}.value='';" aria-label="{{ msg.custom_fields_raz_aria_label | printf custom_field.TITRE }}">{{ msg.custom_fields_raz_button }}</button>

                <input type="hidden" id="{{ custom_field.NAME }}_{{ loop.counter0 }}" name="{{ custom_field.NAME }}[]" value="{{ value.value }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">

                {% if custom_field.MULTIPLE == "yes" and loop.last %}
                    <button type="button" id="button_add_{{ custom_field.NAME }}" name="" class="bouton" onclick="add_{{ custom_field.NAME }}();" aria-label="{{ msg.custom_fields_add_aria_label | printf custom_field.TITRE }}">{{ msg.custom_fields_add_button }}</button>
                    <script>
                        window["fonction_selecteur_{{ custom_field.NAME }}"] = function() {
                            name=this.getAttribute('id').substring(4);
                            name_id = name;
                            openPopUp('./select.php?what=perso&caller=empr_form&p1='+name_id+'&p2=f_'+name_id+'&perso_id={{ custom_field.ID }}&custom_prefixe={{ custom_field.PREFIX }}&dyn=1&perso_name={{ custom_field.NAME }}', 'selector');
                        }
                        window["fonction_raz_{{ custom_field.NAME }}"] = function() {
                            name=this.getAttribute('id').substring(4);
                            document.getElementById(name).value='';
                            document.getElementById('f_'+name).value='';
                        }
                        window["add_{{ custom_field.NAME }}"] = function() {
                            template = document.getElementById('div_{{ custom_field.NAME }}');
                            perso=document.createElement('div');
                            perso.className='row';

                            suffixe = document.getElementById('n_{{ custom_field.NAME }}').value;
                            var nom_id = '{{ custom_field.NAME }}_'+suffixe;
                            var f_perso = document.createElement('input');
                            f_perso.setAttribute('name','f_{{ custom_field.NAME }}[]');
                            f_perso.setAttribute('id','f_'+nom_id);
                            f_perso.setAttribute('data-form-name','f_'+nom_id);
                            f_perso.setAttribute('completion','perso_{{ custom_field.PREFIX }}');
                            f_perso.setAttribute('persofield','{{ custom_field.NAME }}');
                            f_perso.setAttribute('autfield',nom_id);
                            f_perso.setAttribute('type','text');
                            f_perso.className='saisie-50emr';

                            f_perso.setAttribute('value','');

                            var del_f_perso = document.createElement('button');
                            del_f_perso.setAttribute('id','del_{{ custom_field.NAME }}_'+suffixe);
                            del_f_perso.onclick= window["fonction_raz_{{ custom_field.NAME }}"];
                            del_f_perso.setAttribute('type','button');
                            del_f_perso.className='bouton';
                            del_f_perso.setAttribute('readonly','');
                            del_f_perso.setAttribute('aria-label','{{ msg.custom_fields_raz_aria_label | printf custom_field.TITRE }}');
                            del_f_perso.innerHTML='{{ msg.custom_fields_raz_button }}';

                            var f_perso_id = document.createElement('input');
                            f_perso_id.name='{{ custom_field.NAME }}[]';
                            f_perso_id.setAttribute('type','hidden');
                            f_perso_id.setAttribute('id',nom_id);
                            f_perso_id.setAttribute('value','');

                            let buttonAdd = document.getElementById("button_add_{{ custom_field.NAME }}");

                            perso.appendChild(f_perso);
                            perso.appendChild(document.createTextNode(' '));
                            perso.appendChild(document.createTextNode(' '));
                            perso.appendChild(del_f_perso);
                            perso.appendChild(f_perso_id);

                            if(buttonAdd) {
                                perso.appendChild(buttonAdd);
                            }

                            template.appendChild(perso);

                            document.getElementById('n_{{ custom_field.NAME }}').value=suffixe*1+1*1 ;
                            ajax_pack_element(document.getElementById('f_'+nom_id));
                        }
                    </script>
                {% endif %}
            {% endif %}
        {% endblock %}

        {% block select_display %}
            <!-- Affichage en sélecteur classique -->
            {% if custom_field.CHECKBOX == "no" and custom_field.AUTORITE == "no" %}
                <select id="{{ custom_field.NAME }}" name="{{ custom_field.NAME }}[]" {% if custom_field.MULTIPLE == "yes" %}multiple{% endif %} data-form-name="{{ custom_field.NAME }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
                    {% for option in custom_field.OPTIONS %}
                        <option value="{{ option.value }}" {% if value == option.value %}selected{% endif %}>{{ option.lib }}</option>
                    {% endfor %}
                </select>
            {% endif %}
        {% endblock %}
    {% endfor %}
    <input type="hidden" value="{{custom_field.VALUES | length}}" name="n_{{ custom_field.NAME }}" id="n_{{ custom_field.NAME }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
</div>
{% endblock %}