Fonction JS avec Modal Bootstrap

Bonjour et merci de m'accueillir sur ce forum.

J'ai une page avec une liste de sites et pour chacun un bouton Delete relié à une fenêtre modal de Bootstrap pour confirmer la suppression
Je n'arrive pas à récupérer l'id de la ligne à supprimer grâce à la fonction javascript
Merci de me dire où il y a une erreur.

Merci d'avance

<div class="uk-container uk-container-center uk-margin-small-top"> 
  <div class="uk-card uk-card-default uk-card-body">

    <h3 class="uk-card-title uk-text-center">Bienvenue sur votre espace administrateur</h3>
    <h4 class="uk-text-center">Liste des Sites</h4>
    <p><a href="?p=admin.sites.add" class="btn btn-success">Ajouter</a></p>

    <table class="table">
      <thead>
        <tr>
          <th>Index</th>
          <th>Nom</th>
          <th>N° Adhérent</th>
          <th>Login Id</th>
          <th>Mail</th>
          <th>Site</th>
          <th>Mot de Passe</th>
        </tr>
      </thead>
      
      <?php foreach($sites_search as $site): ?>
        <tbody>  
          <tr>
            <td><?= $site->id; ?></td>
            <td><?= $site->name; ?></td>
            <td><?= $site->adhesion; ?></td>
            <td><?= $site->identify; ?></td>
            <td><?= $site->mail; ?></td>
            <td> <a href="<?=$site->siteweb; ?>"><?= $site->siteweb; ?></a></td>
            <td><?= $site->password; ?></td>
            <td>
              <a class="btn btn-primary" href="?p=admin.sites.edit&id=<?= $site->id; ?>">Editer</a>
            </td>
            <td>  
              <!--BOUTON EFFACER-->
              <button type="button" class="btn btn-danger deletebtn" data-toggle="modal" data-target="#deleteModal">Effacer</button>
            </td> 
          </tr>
        </tbody> 
      <?php endforeach; ?>   
           
    </table>

    <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">

      <div class="modal-dialog" role="document">
        <div class="modal-content">

          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Supression Site</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          
          <form  action="index.php?p=admin.sites.delete" method="post">

            <div class="modal-body">
              <!--<input type="hidden" name="delete_id" id="delete_id" value="<?=$site->id; ?>">-->
              <input type="hidden" name="delete_id" id="delete_id" >
              <h4>Voulez vous supprimer ce site ?</h4>
            </div>

            <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">Non</button>
              <button type="submit" name="deletedata" class="btn btn-primary">Oui</button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>

<script>

  $(document).ready(function () {
    $('.deletebtn').on('click',function() {
     

      $('#deletemodal').modal('show');

      $tr= $(this).closest('tr');

      var data=$tr.children("td").map(function(){
        return $(this).text();
      }).get();

      console.log(data);

    $('#delete_id').val(data[0]);
    });
  });

</script>  
       

Modifié par dudu22 (17 Nov 2019 - 13:08)