首页 > 解决方案 > 单击产品磁贴从数据库中获取产品数据

问题描述

所以我使用'while'在我的主页上显示产品,我希望当用户点击产品磁贴时,它会被重定向到包含有关该特定产品的所有详细信息的文件 product_page.php,我不知道它是否因为我使用的是“a”标签,但它不起作用

<?php
include 'config.php';
$stmt = $conn->prepare("SELECT * FROM product");
$stmt->execute();
$result = $stmt->get_result();
while($row = $result->fetch_assoc()):
?> 
<div class="col-sm-6 col-md-4 col-lg-3 mb-2" > 
<a href="product_page.php">
<div class="card-deck" id="product"> 
<div class="card border border-light ">
<img class="card-img-top" src="<?= $row['product_image'] ?>" >
<div class="card-body border border-light" style="background-color: #ffffff">
  <h4 class="card-title text-center text-info"><?= $row['product_name'] ?></h4>
  <h5 class="card-text text-center text-danger">Rs. <?= number_format($row['product_price'],2) ?> 
</h5> 
</div>
<div class="card-footer border border-light" style="background-color: #ffffff">
<form action="" class="form-submit">
  <input type="hidden" class="pid" value="<?= $row['id']?>">
  <input type="hidden" class="pname" value="<?= $row['product_name']?>">
  <input type="hidden" class="pprice" value="<?= $row['product_price']?>">
  <input type="hidden" class="pimage" value="<?= $row['product_image']?>">
  <input type="hidden" class="pcode" value="<?= $row['product_code']?>">
  <button class="btn btn-block addItemBtn" style="background-color: #FE701E; color:#ffffff">Add To 
   Cart</button>
  </form>
</div>
</div>
</div>
</a>
</div>

<?php endwhile; ?>

这是我的 action.php 代码

if(isset($_POST['pid']))
{
$pid = $_POST['pid'];
$pname = $_POST['pname'];
$pprice = $_POST['pprice'];
$pimage = $_POST['pimage'];
$stmt = $conn->prepare("SELECT * FROM product WHERE pid=? LIMIT 1");
$stmt->bind_param("i",$pid);
$stmt->execute();
$pcount=mysqli_num_rows($stmt);
$res = $stmt->get_result();
$r = $res->fetch_assoc();
if($pcode>0)
{
$_SESSION['product_name'] =$r['product_name'];
$_SESSION['product_price'] =$r['product_price'];
$_SESSION['product_image'] =$r['product_image'];
header("Location:product_page.php");
}

这是ajax请求

$(document).ready(function(){
  $("#product").click(function(e){
    e.preventDefault();
    var $form =$(this).closest(".form-submit");
    var pid = $form.find(".pid").val();
    var pname = $form.find(".pname").val();
    var pprice = $form.find(".pprice").val();
    var pimage = $form.find(".pimage").val();
    var pcode = $form.find(".pcode").val();

    $.ajax({
      url:'action.php',
      method:'post',
      data:{pid:pid,pname:pname,pprice:pprice,pimage:pimage,pcode:pcode},
      success:function(response){
                 }
    });
  });});

标签: phphtmlmysqlajax

解决方案


您正在调用 ajax 请求#product。由于您是在一个循环中展示产品,#product因此并不是唯一的。IDhtml 的任何元素在同一页面中都应该是唯一的。我建议您改为提供 id所以您可以创建一个唯一的 id,例如<form>-<div>

<form action="" class="form-submit" id="product_<?php echo $row['id']; ?>"> 

然后你可以调用一个ajax请求。-

$(document).on('submit', '[id^="product_"]', function(){
  e.preventDefault();
    var $form =$(this).closest(".form-submit");
    var pid = $form.find(".pid").val();
    var pname = $form.find(".pname").val();
    var pprice = $form.find(".pprice").val();
    var pimage = $form.find(".pimage").val();
    var pcode = $form.find(".pcode").val();

    $.ajax({
      url:'action.php',
      method:'post',
      data:{pid:pid,pname:pname,pprice:pprice,pimage:pimage,pcode:pcode},
      success:function(response){
                 }
    });
});

推荐阅读