{% extends "custom_field.tpl.html" %}
<!-- $Id: custom_field_comment.tpl.html,v 1.1.2.2 2026/03/16 13:14:16 rtigero Exp $ -->

{% block field %}
<div id="div_{{ custom_field.NAME }}">
	{% for value in custom_field.VALUES %}
		<textarea id="{{ custom_field.NAME }}" cols="{{ custom_field.COLS }}" rows="{{ custom_field.ROWS }}" maxlength="{{ custom_field.MAXSIZE }}" name="{{ custom_field.NAME }}[]" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">{{ value }}</textarea>
	{% endfor %}
    {% if custom_field.REPEATABLE  == "1" %}
        <input id="customfield_comment_{{ custom_field.ID }}" type="hidden" name="customfield_comment_{{ custom_field.ID }}" value="{{ custom_field.VALUES | length }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
		<button type="button" id="button_add_{{ custom_field.NAME }}_{{ custom_field.ID }}" 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["add_{{ custom_field.NAME }}"] = function() {
				document.getElementById('customfield_comment_{{ custom_field.ID }}').value = document.getElementById('customfield_comment_{{ custom_field.ID }}').value * 1 + 1;
				count = document.getElementById('customfield_comment_{{ custom_field.ID }}').value;

				var node_id = "div_{{ custom_field.NAME }}";
				var	buttonAdd = document.getElementById('button_add_{{ custom_field.NAME }}_{{ custom_field.ID }}');

				f_aut0 = document.createElement('textarea');
				f_aut0.setAttribute('name', '{{ custom_field.NAME }}[]');
				f_aut0.setAttribute('id', '{{ custom_field.NAME }}_' + count);
				f_aut0.setAttribute('cols','{{ custom_field.COLS }}');
				f_aut0.setAttribute('rows','{{ custom_field.ROWS }}');
				f_aut0.setAttribute('maxlength','{{ custom_field.MAXSIZE }}');

				space=document.createElement('br');

				document.getElementById(node_id).appendChild(f_aut0);
				if (buttonAdd) {
                    document.getElementById(node_id).appendChild(buttonAdd);
                }
				document.getElementById(node_id).appendChild(space);
			}
        </script>
    {% endif %}
</div>
{% endblock %}