<table class="table table-hover tableForm" id='ligneContactFou'>
    <thead class="thead-dark">
        <tr>
            {% for champsCtc in listeChampsCtc %}
                <th scope="col">{{ champsCtc.LIB_CHP | trad }}</th>
            {% endfor %}
            <th scope="col" width="60px">
                {% if droit.HA_FRS_CON %}
                    <a class="ajouter_blanc_v2  white-tooltip"  onClick="ajoutLigneContact('{{ infoFrs.CODE }}');" style="float: right;">
                        <span class="infos_tooltip left">
                            {{ 'Ajouter un contact' |trad }}
                        </span>
                    </a>
                {% endif %}
            </th>
        </tr>
    </thead>
    
    {% for ligne in listeContactFou %}
        {% include '@rechercheArticles/Fournisseur/_ligneContact.twig' %}
    {% endfor %}
</table>

<script>
    function ajoutLigneContact(codeFou, edit)
    {
        $.ajax({
          	dataType : 'html',
        	url: "{{ path('GlobalApplication.ContactsFournisseur.ajaxAjoutLigneContact', {contexte: 'panier'}) }}",
        	data: {'FOU' : codeFou, 'CODE' : '','idClose' : 'ongletCtc', 'MODIF_CONTACT_FOU' : edit, 'fromConsultation': '{{ fromConsultation? 1:0 }}'},
        	type: "POST",
        	success: function(result){
            	$('#onglet_DivModulableCreation').show();
            	$('#onglet_DivModulableCreation')
                    .find('a')
                    .html(edit === undefined ? 
                        {{ 'Création contact' | trad | json }} :
                        {{ 'Modification contact' | trad | json }}
                    )
                    .trigger('click');
        		$('#DivModulableCreation').html(addFonctionAjax(result));
            	desactiveLoader();
        	}
        });
    }

        document.addEventListener('click',(event) => {
            var target = event.target;
            if (!(target instanceof HTMLElement) ) {
                return;
            }

            if (!target.hasAttribute('data-changeCtc') ){
                return;
            } 

            $('#input_NOM').val($(target).data('nom'));
            $('#input_FONCTION').val($(target).data('fonction'));
            $('#input_TEL').val($(target).data('tel'));
            $('#input_FAX').val($(target).data('fax'));
            $('#input_TELPORT').val($(target).data('portable'));
            $('#input_EMAIL').val($(target).data('email'));

        });
</script>