動的php id JQuery ajaxの出力は変更されません

Question

新しいページでボタンを選択すると、すべての情報が表示されますが、別のページがクリックされても常に最初の情報が表示され、ページが更新されるまで変更されません。

これを渡すのを手助けしますか？

ボタン

<?php while($b = mysqli_fetch_assoc($equery)): ?> 
       <button type="button" onclick="modal(<?=$b['id'];?>)" class="w3-btn w3-border" style="width: 260px; display: inline-block; margin: 9px"> 
        <img src=""> 
        <h3><?php echo $b['product'];?></h3> 
        <h5>Descritopm</h5> 
        <h6></h6> 
       </button> 
      <?php endwhile;?> 

JS：

function modal(id){ 
       var data = {"id" : id}; 
       jQuery.ajax({ 
        url : <?=BASEURL;?>+'includes/modal.php', 
        method : "post", 
        data : data, 
        success: function(data){ 
         jQuery('body').append(data); 
         jQuery('#mod').modal('show'); 
        }, 
        error: function(){ 
         alert("IDK") 
        } 
       }); 
      } 

モーダル：

<?php 
require_once '../core/init.php'; 
$id = $_POST['id']; 
$id =(int)$id; 
$sql = "SELECT * FROM aisle WHERE id = '$id'"; 
$result = $db->query($sql); 
$product = mysqli_fetch_assoc($result); 

?> 

<!-- Modal --> 
<?php ob_start();?> 
<div id="mod" class="modal fade" role="dialog" tabindex="-1"> 
    <div class="modal-dialog"> 

    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
     <h3 class="modal-title w3-center"><?=$product['product'];?></h3> 
     </div> 
     <div class="modal-body"> 
     <p><?=$product['aisle'];?></p> 
     <p>$<?=$product['price'];?></p> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 

    </div> 
</div> 
<?php echo ob_get_clean();?> 

Answer 1

問題はここに

jQuery('body').append(data); 

です

この行はappend多くのモーダルがあり、多くのモーダルがページに表示されます。あなたはこのようにしなければなりません。本体タグ内にcontents_from_ajaxというdivタグを作成し、これを使用します。

jQuery('#contents_from_ajax').html(data); 

このコードはすべての古いモーダルを削除し、追加するのではなく新しいモーダルを作成し、正常に動作します。

・ホープ、このヘルプ

---