Button with AJAX source

Fil6718

This is my code to display my table
$(document).ready(function() {

var table = $('#judo').DataTable( {
    lengthChange: true,
    language:
    {
    "lengthMenu": "Affichage de _MENU_ enregistrements par page     ", 
    "oPaginate": {
    "sFirst":      "Premier",
    "sPrevious":   "Précédent",
    "sNext":       "Suivant",
    "sLast":       "Dernier"
                },
    "sSearch":         "Rechercher :",
    "sInfo":           "Affichage de l'élément _START_ à _END_ sur _TOTAL_ éléments",
    "sInfoEmpty":      "Affichage de l'élément 0 à 0 sur 0 élément",
    "sInfoFiltered":   "(filtré de _MAX_ éléments au total)",
    "sInfoPostFix":    "",
    "sLoadingRecords": "Chargement en cours...",
    "sZeroRecords":    "Aucun élément à afficher",
    "sEmptyTable":     "Aucune donnée disponible dans le tableau",

    },
    columnDefs: [
    { "orderable": false, "targets":  [6,7,11,12,13,14,15,16,17]  },
    { "width": "210px", "targets": [5] }    
    ],
    "ajax": "../wp-content/plugins/liste_adherents/text.txt",
    "columns": [
        {
            "className":      'details-control',
            "orderable":      false,
            "data":           null,
            "defaultContent": ''
        },
        { "data": "nom" },
        { "data": "prenom" },
        { "data": "annee" },
        { "data": "activite" },
        { "data": "creneaux" },
        { "data": "actif" },
        { "data": "actif_lien" },
        { "data": "telephone" },
        { "data": "mail" },
        { "data": "hutte" },
        { "data": "reglement" },
        { "data": "reglement_lien" },
        { "data": "certificat" },
        { "data": "certificat_lien" },
        { "data": "licence" },
        { "data": "licence_lien" },
        { "data": "fiche" }
    ],
    initComplete: function () {
        this.api().columns([6,11,13,15]).every( function () {
            var column = this;
            var select = $('<select><option value=""></option></select>')
                .appendTo( $(column.header()).empty() )
                .on( 'change', function () {
                    var val = $.fn.dataTable.util.escapeRegex(
                        $(this).val()
                    );

                    column
                        .search( val ? '^'+val+'$' : '', true, false )
                        .draw();
                } );

            column.data().unique().sort().each( function ( d, j ) {
                select.append( '<option value="'+d+'">'+d+'</option>' )
            } );

        } );
    },} );

I try to add this buttons

buttons: [
{
extend: 'copy',
text: '<i class="fa fa-files-o"></i>',
titleAttr: 'Copier',
exportOptions:{
columns: ':visible'}
},
{
extend: 'csv',
text: '<i class="fa fa-file-text-o"></i>',
titleAttr: 'CSV',
exportOptions:{
columns: ':visible'}
}
]

but i didn't arrive. I have read that i have to use initComplete to insert buttons with ajax. I dont know how use this command.

Someone can help me ?

Thanks in advance.

Phil

Fil6718

I try a lot of think but i didn't arrive...
I have put this

    buttons: [
    {
    extend:    'copy',
    text:      '<i class="fa fa-files-o"></i>',
    titleAttr: 'Copier',
    exportOptions:{
        columns: ':visible'}
      }
     ]

and this after

    initComplete: function( settings, json ) {
        table.buttons().container().appendTo('#UserHead');
    },

but nothing appear....