✔ Daten in Modal übergeben..

[CreativPur]

Hi,
ich habe eine Tabelle mit Kurzinfos von Usern, welche ich mit

<?php foreach ($pdo->query($sql) as $row) { ?>

ausgebe.

Für weitere Informationen möchte ich ein Modal-Fenster benutzen.

Daher ist logischerweise für jeden User in der Tabelle ein Button zum öffnen des Modal-Fenster.

<button type="button" class="btn btn-primary" style="background:#fff; border-color:#fff;"  data-toggle="modal" data-target="#exampleModal"  data-1="<?php echo $row['vorname']; ?>" data-2="<?php echo $row['nachname']; ?>"><span class="glyphicon glyphicon-eye-open green" style="font-size:16px;"></span></button>

Mein Script dafür sieht folgend aus..

<script>
$('#exampleModal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget)
var vorname = button.data('1')
var nachname = button.data('2')
var modal = $(this)
modal.find('.modal-title .modal-vorname').text(vorname)
modal.find('.modal-title .modal-nachname').text(nachname)
modal.find('.modal-body .modal-vorname').text(vorname)
modal.find('.modal-body .modal-nachname').text(nachname)
})
</script>

Das Modalfenster...

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">Profil von <div class="modal-vorname"></div> <div class="modal-nachname"></div></h4>
      </div>
      <div class="modal-body">
           <div class="container">
                Vorname: <div class="modal-vorname"></div>
                <br />
               Nachname: <div class="modal-nachname"></div>
           </div>
     </div
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">schließen</button>
      </div>
    </div>
  </div>
</div>

Leider werden keine Daten ausgegeben.. Woran liegt dies ?

 

[CreativPur]

Ich habe es jetzt folgend gelöst..

<button type="button" class="btn btn-primary" style="background:#fff; border-color:#fff;" data-toggle="modal" data-target="#profil<?php echo $row['Sitter_id'];?>"><span class="glyphicon glyphicon-eye-open green" style="font-size:16px;"></span></button>

<script>
$(document).ready(function(){
   $('#myModal').on('show.bs.modal', function (e) {
       var rowid = $(e.relatedTarget).data('Sitter_id');
       $.ajax({
           type : 'post',
           url : 'fetch_record.php', //Here you will fetch records
           data :  'rowid='+ rowid, //Pass $id
           success : function(data){
           $('.fetched-data').html(data);//Show fetched data from database
           }
       });
    });
});
</script>

<?php
$sql = "SELECT * FROM sitters";
foreach ($pdo->query($sql) as $row) {
?>

<div id="profil<?php echo $row['Sitter_id'];?>" class="modal fade" 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">
       Sitter-Profil von <?php echo $row['vorname'];?> <?php echo $row['nachname'];?></h4>
     </div>
     <div class="modal-body">
       <?php echo $row['Sitter_id'];?><br />
       <?php echo $row['vorname'];?>
     </div>
     <div class="modal-footer">
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
     </div>
   </div>
  </div>
</div>
<? } ?>