Click in checkbox gives me undefined

I am new in php and I have problem whith checkbox. Infact when I check one of the checkboxs in table it should gives me my data but unfortunately it gives me undefined.

here is my code befor click in checkbox enter image description here

and after click for exemple in the checkbox in the first line enter image description here

and this is my code :

$(document).on('click', '.check_box', function(){
    var html = '';
    if(this.checked)
    {
        html = '<td><input type="checkbox" id="'+$(this).attr('id')+'" data-Projet="'+$(this).data('Libelle_Projet')+'" data-Num-Produit="'+$(this).data('Num_Produit')+'" data-Libelle-Produit="'+$(this).data('Libelle_Produit')+'" data-Titre-Foncier-Produit="'+$(this).data('Titre_Foncier_Produit')+'" data-Superficie-Produit="'+$(this).data('Superficie_Produit')+'" data-Date-Reception-Administratif-Temp="'+$(this).data('Date_Reception_Administratif_Temp')+'" data-Date-Contrat-Temp="'+$(this).data('Date_Contrat_Temp')+'" class="check_box" checked /></td>';
        html += '<td>'+$(this).data("Libelle_Projet")+'</td>';
        html += '<td>'+$(this).data("Num_Produit")+'</td>';
        html += '<td>'+$(this).data("Libelle_Produit")+'</td>';
        html += '<td>'+$(this).data("Titre_Foncier_Produit")+'</td>';
        html += '<td>'+$(this).data("Superficie_Produit")+'</td>';
        html += '<td><input type="date" name="Date_Reception_Administratif_Temp[]" class="form-control" value="'+$(this).data("Date_Reception_Administratif_Temp")+'" /></td>';
        html += '<td><input type="date" name="Date_Contrat_Temp[]" class="form-control" value="'+$(this).data("Date_Contrat_Temp")+'" /><input type="hidden" name="hidden_id[]" value="'+$(this).attr('id')+'" /></td>';
    }
    else
    {
        html = '<td><input type="checkbox" id="'+$(this).attr('id')+'" data-Projet="'+$(this).data('Libelle_Projet')+'" data-Num-Produit="'+$(this).data('Num_Produit')+'" data-Libelle-Produit="'+$(this).data('Libelle_Produit')+'" data-Titre-Foncier-Produit="'+$(this).data('Titre_Foncier_Produit')+'" data-Superficie-Produit="'+$(this).data('Superficie_Produit')+'" data-Date-Reception-Administratif-Temp="'+$(this).data('Date_Reception_Administratif_Temp')+'" data-Date-Contrat-Temp="'+$(this).data('Date_Contrat_Temp')+'" class="check_box" /></td>';
        html += '<td>'+$(this).data('Libelle_Projet')+'</td>';
        html += '<td>'+$(this).data('Num_Produit')+'</td>';
        html += '<td>'+$(this).data('Libelle_Produit')+'</td>';
        html += '<td>'+$(this).data('Titre_Foncier_Produit')+'</td>';
        html += '<td>'+$(this).data('Superficie_Produit')+'</td>';
        html += '<td>'+$(this).data('Date_Reception_Administratif_Temp')+'</td>';    
        html += '<td>'+$(this).data('Date_Contrat_Temp')+'</td>';         
    }
    $(this).closest('tr').html(html);
});

my table code :

<form method="post" id="update_form">
        <div id="divShow" class="table-responsive">
          <table class="table table-bordered table-striped">
            <thead>
              <th width="2%"></th>
              <th width="15%">Projet</th>
              <th width="10%">Numéro Produit</th>
              <th width="15%">Dénomination</th>
              <th width="10%">Titre Foncier</th>
              <th width="5%">Superficie</th>
              <th width="15%">Date Réception Admin</th>
              <th width="15%">Date Contrat</th>
            </thead>
            <tbody></tbody>
          </table>
        </div>
        
        <br />

        <div align="left">
          <input type="submit" name="multiple_update" id="multiple_update" class="btn btn-info" value="Valider"  style="display: none;" />
        </div>

        <br />

        <div id="msgSelectProduit" style="display: none;"></div>
        <div id="msgSelectDateContrat" style="display: none;"></div>
      </form>

$.ajax({
        url:"selectTOUT.php",
        method:"POST",
        dataType:"json",
        success:function(data)
        {
            var html = '';
            for(var count = 0; count < data.length; count++)
            {
                html += '<tr>';
                html += '<td><input type="checkbox" id="'+data[count].id+'" data-Projet="'+data[count].Libelle_Projet+'" data-Num-Produit="'+data[count].Num_Produit+'" data-Libelle-Produit="'+data[count].Libelle_Produit+'" data-Titre-Foncier-Produit="'+data[count].Titre_Foncier_Produit+'" data-Superficie-Produit="'+data[count].Superficie_Produit+'" data-Date-Reception-Administratif-Temp="'+data[count].Date_Reception_Administratif_Temp+'" data-Date-Contrat-Temp="'+data[count].Date_Contrat_Temp+'" class="check_box"/></td>';
                html += '<td>'+data[count].Libelle_Projet+'</td>';
                html += '<td>'+data[count].Num_Produit+'</td>';
                html += '<td>'+data[count].Libelle_Produit+'</td>';
                html += '<td>'+data[count].Titre_Foncier_Produit+'</td>';
                html += '<td>'+data[count].Superficie_Produit+'</td>';
                html += '<td>'+data[count].Date_Reception_Administratif_Temp+'</td>';
                html += '<td>'+data[count].Date_Contrat_Temp+'</td></tr>';
            }
            $('tbody').html(html);
        }
    });