使用PHP、 AJAX 从使用ID的URL传递包含项目详细信息的JSON数据

ulydmbyx  于 2023-05-16  发布在  PHP
关注(0)|答案(1)|浏览(111)

我必须从使用动态ID的URL(例如https://www.example.com/api/prDetails?prId=4100275)中获取包含项目详细信息的JSON数据
我设法做了一个循环来列出products.php页面中的所有产品,并将每个产品的ID分配为例如data-id=4100275

<a data-id="4100275">Coffee Beans</div>
<a data-id="6530113">Bananas</div>

<!--Display Product Details inside the div below-->
<div id="prDetails"></div>

因此,我想单击一个产品项目,并在同一页面上的<div id="prDetails"></div>中显示其详细信息,而无需刷新或退出products.php页面。

编辑主要问题

如何传递data-id=".$id."并在test.php中使用它。

<script> 
   $(document).ready(function() {
    
      $("div.item-link a").on("click", function(e) {
    
         e.preventDefault();
    
         $.ajax({
    
            type: 'POST', // IF you want to pass the id in the query stringthe id in the query string
            url: "test.php?prId=" + e.currentTarget.dataset.id, 
    
            success: function(data) {
               $("#prDetails").html(data);
            }
        });
    
     });
  });
</script>

然后在test.php上使用<?php echo $_GET['prId']; ?>获取传递的id。
谢谢你

vof42yt1

vof42yt11#

@DanielOmara你正在寻找的例子是一个很好的起点。
我建议你给所有包含 data-id 的标签分配相同的类,或者更好的方法是给它们的conatainer分配一个类,就像这样:

<div class="item-link">
    <a data-id="4100275">Coffee Beans</a>
    <a data-id="6530113">Bananas</a>
</div>

然后你可以使用一个选择器来添加一个事件监听器到标签中:

$(document).ready(function() {

   $("div.item-link a").on("click", function(e) {

       e.preventDefault();

       $.ajax({

          type: 'POST',
          url: "test.php?prId=" + e.currentTarget.dataset.id, 

          success: function(data) {
             $("#prDetails").html(data);
          }
       });

     });
});

现在,在 * test.php * 中,您可以读取$_GET ['prId'],获取与此 id 相关的详细信息,并回显您希望在 prDetails 中显示的数据

相关问题