php - Ajax Mysql PHP 如何将 $_SESSION 数组结果显示到 DIV 中

Question

我的 friend 们，

我在 Ajax 和 PHP 集成方面遇到了一些难题。我有一个简单的代码，如下所示，它从数据库返回数据并显示到 div class="item-list"。当用户输入数量并点击提交按钮时，所选商品将上传到 div class="returned"，类似于“将商品添加到购物车”功能。该代码也可以正常工作(从列表中添加和删除)，但只能在页面上刷新。我在网上看到了很多例子，我试图将它们改编成我的代码(今天是我奋斗的第三天)，但没有成功。您能告诉我一种无需刷新页面即可将所选项目加载到 div class="returned"中的方法吗？

致以最诚挚的问候，非常感谢!

  <?php
session_start();

   if(isset($_POST["add_to_table"])){
   if(isset($_SESSION["dynamic_list"])){    

    $item_array_id = array_column($_SESSION["dynamic_list"], "item_id");
    if(!in_array($_GET["idproduct"], $item_array_id)){
    $count = count($_SESSION["dynamic_list"]);
    $item_array = array(
                'item_id' => $_GET["idproduct"],
                'model' => $_POST["got_model"],
                'price' => $_POST["got_price"],
                'item_quantity' => $_POST["quantity"]
                );
        $_SESSION["dynamic_list"][$count] = $item_array;         
}else{
    echo'<script>alert("Item added!")</script>';
    echo'<script>window.location="intransit.php"</script>';
    }
 }else{
   $item_array = array(
                'item_id' => $_GET["idproduct"],
                'model' => $_POST["got_model"],
                'price' => $_POST["got_price"],
                'item_quantity' => $_POST["quantity"]
                 );
                 $_SESSION["dynamic_list"][0] = $item_array;
    }
   }

    if(isset($_GET["action"])){
    if($_GET["action"] == "delete"){
    foreach($_SESSION["dynamic_list"] as $list => $values){
    if($values["item_id"] == $_GET["idproduct"]){  
       unset($_SESSION["dynamic_list"][$list]);
       echo'<script>alert("Item removed!")</script>'; 
       echo'<script>window.location="intransit.php"</script>'; 
        }
      }
   }
}
?>

 <?php include"header.php" ?>
 <div id="main_box">
<div id="moviment">
<div class="item_list">
<?php
  $query = "SELECT * FROM products ORDER BY model ASC LIMIT 3";
  $result = mysqli_query($connect, $query);
  if(mysqli_num_rows($result) > 0){

     while($row = mysqli_fetch_array($result)){
 ?>
<div id="product_table">
<form method="post" action="intransit.php?action=add&idproduct=<?php echo $row["idproduct"]; ?>">
<span><img src="images/<?php echo $row["image"]; ?>" alt="motor" width="80" height="80" /></span>
<span>Model:&nbsp<?php echo $row["model"]; ?></span>
<span>Price:&nbsp<?php echo $row["unitprice"]; ?></span>
<input type="text" name="quantity" value="1" class="qty" />
<input type="hidden" name="got_model" value="<?php echo $row["model"]; ?>"  /> 
<input type="hidden" name="got_price" value="<?php echo $row["unitprice"]; ?>"  />
<input type="submit" name="add_to_table" value="Add Item" />
</form>
</div><!--end "product_table"-->
<?php       
    }
  }
   ?>
    </div><!--end "item_list"-->
    <div class="returned">
     <table>
    <tr>
    <th>Model</th>
    <th>Qty</th>
    <th>Price</th>
    <th>Total</th>
    <th>Action</th>
   </tr>
    <?php
   if(!empty($_SESSION["dynamic_list"])){
   $total = 0;
   foreach($_SESSION["dynamic_list"] as $list => $values){  
?>  
    <tr>
    <td><?php echo $values["model"]; ?></td>
    <td><?php echo $values["item_quantity"]; ?></td>
    <td>$<?php echo $values["price"]; ?></td>
    <td><?php echo number_format($values["item_quantity"] * $values["price"], 2); ?></td>
    <td><a href="intansit.php?action=delete&idproduct=<?php echo $values["item_id"]; ?>">Remove</a></td>


</tr>
 <?php
    $total = $total + ($values["item_quantity"] * $values["price"]);
  }
  ?>
  <tr>
  <td colspan="3" align="right">Total</td>
  <td align="right">$ <?php echo number_format($total, 2);?></td>
  <td></td>
  </tr>

  <?php
}
?>
 </table>

</div>
</div>
</div>
<?php include"footer.php" ?>

Answer 1

我试图使示例不那么复杂，并使其适用于您已经创建的代码。

if (isset($_POST['got_model'])) {
    $_SESSION["dynamic_list"][$_GET["idproduct"]] = array(
        'item_id'       => $_GET["idproduct"],
        'model'         => $_POST["got_model"],
        'price'         => $_POST["got_price"],
        'item_quantity' => $_POST["quantity"]
    );
    return show_dynamic_list();
}

if (isset($_POST["action"]) && $_POST["action"] == "delete") {
    unset($_SESSION["dynamic_list"][$_POST["idproduct"]]);
    return show_dynamic_list();
}

function show_dynamic_list(){
    ?>
    <table>
        <tr><th>Model</th><th>Qty</th><th>Price</th><th>Total</th><th>Action</th></tr>
        <?php
        $total = 0;
        foreach ($_SESSION["dynamic_list"] as $list => $values) {
            ?>
            <tr>
                <td><?php echo $values["model"]; ?></td>
                <td><?php echo $values["item_quantity"]; ?></td>
                <td>$<?php echo $values["price"]; ?></td>
                <td><?php echo number_format($values["item_quantity"] * $values["price"], 2); ?></td>
                <td>
                    <form action="" method="post" class="delete_form">
                        <input type="hidden" name="idproduct" value="<?php echo $values["item_id"]; ?>"/>
                        <input type="hidden" name="action"  value="delete"/>
                        <input type="submit"  value="Remove">
                    </form>
                </td>
            </tr>
            <?php
            $total = $total + ($values["item_quantity"] * $values["price"]);
        }
        ?>
        <tr>
            <td colspan="3" align="right">Total</td>
            <td align="right">$ <?php echo number_format($total, 2); ?></td>
            <td></td>
        </tr>
    </table>
    <?php
}



include"header.php" ?>
    <div id="main_box">
        <div id="moviment">
            <div class="item_list">
                <?php
                $query = "SELECT * FROM products ORDER BY model ASC LIMIT 3";
                $result = mysqli_query($connect, $query);
                if(mysqli_num_rows($result) > 0){
                    while($row = mysqli_fetch_array($result)){
                        ?>
                        <div id="product_table_<?php echo $row["idproduct"]; ?>">
                            <form method="post" action="?action=add&idproduct=<?php echo $row["idproduct"]; ?>">
                                <span>Model:&nbsp<?php echo $row["model"]; ?></span>
                                <span>Price:&nbsp<?php echo $row["unitprice"]; ?></span>
                                <input type="text" name="quantity" value="1" class="qty"/>
                                <input type="hidden" name="got_model" value="<?php echo $row["model"]; ?>"/>
                                <input type="hidden" name="got_price" value="<?php echo $row["unitprice"]; ?>"/>
                                <input type="submit" name="add_to_table" value="Add Item"/>
                            </form>
                        </div><<!--end "product_table"-->
                        <?php
                    }
                }
                ?>
            </div><!--end "item_list"-->
            <div class="returned">
                <?php show_dynamic_list(); ?>
            </div>
        </div>
    </div>
    <script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>
    <script type="text/javascript">
        $(function () {
            $('body').on('submit','#moviment form,.delete_form',function (event) {
                event.preventDefault(); // Prevent the form from submitting via the browser
                var form = $(this);
                $.ajax({
                    type:'post',
                    url: form.attr('action'),
                    data: form.serialize(),
                    dataType:'html'
                }).done(function (data) {
                    $('.returned').html(data);
                }).fail(function (data) {
                    // error
                });
            });
        });
    </script>
<?php include"footer.php";