2
votes

Passer l'ID de données du bouton au modal d'amorçage

J'essaie de transmettre le 'data-id' du code ci-dessous:

  <script>
    $(document).on("click", ".passingID", function () {
     var ids = $(this).data('id');
     $(".modal-body #idkl").val( ids );
    });
  </script>

À une valeur de formulaire de saisie ici:

<div class="modal-body">
    <form method="post" action="tambahkaryawan.php">
      <input type="hidden" class="form-control" name="idkl" id="idkl" value="">
    </form>
</div>

Voici la jquery que j'utilise:

<a data-toggle="modal" data-id="10" class="passingID">
   <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#editkaryawan">
       <i class="fas fa-pencil-alt"></i> Edit</button>
</a>

php jquery html

2 commentaires

quelle est la solution?

@DevsiOdedra la valeur ne sera pas transmise à la balise

3 Réponses :

5
votes

J'utilise généralement .attr pour les attributs data- * et cela fonctionne.

$(this).attr('data-id');

4 commentaires

@DevsiOdedra data () et attr () ne font pas la même chose. Voir stackoverflow.com/questions/7261619/jquery-data-vs-attr

Ouais, mais mec voulait la valeur réelle de l'attribut, alors je pense que c'est la voie à suivre.

@WKoppel Je préfère utiliser la méthode que vous suggérez dans votre réponse en raison des problèmes discutés dans le fil de discussion que j'ai lié. Je faisais simplement remarquer que data () et attr () ne sont pas synonymes comme suggéré dans le commentaire avant le mien qui a depuis été supprimé.

@WKoppel j'ai essayé d'utiliser attr () mais cela ne fonctionne toujours pas, je ne sais pas pourquoi

2
votes

Vous pouvez également essayer comme ceci, en utilisant Jquery pour afficher les poup modales

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>




<button type="button" class="btn btn-info btn-lg passingID" data-id="10">Open Modal</button>


<!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <form method="post" action="tambahkaryawan.php">
            <input type="text" class="form-control" name="idkl" id="idkl" value="">
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>

$(".passingID").click(function () {
    var ids = $(this).attr('data-id');
    $("#idkl").val( ids );
    $('#myModal').modal('show');
});

0 commentaires

2
votes

il est assez simple de passer une valeur ou un ID, vérifiez ceci

avec ce bouton, je vais déclencher le Modal et également transmettre l'ID de données qui est généré dynamiquement à partir de PHP, vous pouvez également en faire un titre ou tout autre autres informations nécessaires.

<input type="text" name="dataid" id="dataid" value=""/>

Mon modall s'appelle showmodal comme vous pouvez le voir

dans le corps du modal, ajoutez le code suivant

 <button data-id="<? echo $note['id'] ?>"  onclick="$('#dataid').val($(this).data('id')); $('#showmodal').modal('show');" >click me</button>

cela affichera la valeur du bouton.

J'espère que cela aidera quelqu'un

0 commentaires