如何在当前页面不刷新的情况下在另一页面上 post？

Question

我正在构建购物车。我希望这样，每次有人点击提交以将商品添加到他们的购物车时，它都会添加该商品，但它会停留在当前页面上而不刷新。然后，如果他们点击购物车图标，它将把他们带到一个单独的页面，那里有他们的商品。使用下面的 PHP，我可以提交商品，它们将显示在购物车页面中，但提交按钮仍会刷新购物页面。

<?php
session_start();
$connect = mysqli_connect("localhost", "root", "root", "tut");
if(isset($_POST["add"]))
{
  if(isset($_SESSION["cart"]))
  {
    $item_array_id = array_column($_SESSION["cart"], "product_id");
    if(!in_array($_GET["id"], $item_array_id))
    {
      $count = count($_SESSION["cart"]);
      $item_array = array(
      'product_id' => $_GET["id"],
      'item_name' => $_POST["hidden_name"],
      'product_price' => $_POST["hidden_price"],
      'item_quantity' => $_POST["quantity"]
      );
      $_SESSION["cart"][$count] = $item_array;
      echo '<script>window.location="index.php"</script>';
    }
    else
    {
      echo '<script>alert("Products already added to cart")</script>';
      echo '<script>window.location="index.php"</script>';
    }
  }
  else
  {
    $item_array = array(
    'product_id' => $_GET["id"],
    'item_name' => $_POST["hidden_name"],
    'product_price' => $_POST["hidden_price"],
    'item_quantity' => $_POST["quantity"]
    );
    $_SESSION["cart"][0] = $item_array;
  }
}
if(isset($_GET["action"]))
{
  if($_GET["action"] == "delete")
  {
    foreach($_SESSION["cart"] as $keys => $values)
    {
      if($values["product_id"] == $_GET["id"])
      {
        unset($_SESSION["cart"][$keys]);
        echo '<script>alert("Product has been removed")</script>';
        echo '<script>window.location="thebag.php"</script>';
      }
    }
  }
}
?>

  <div id="mainform">
  <div id="form">


            <form method="post" action="index.php?action=add&id=<?php echo $row["id"]; ?>" id="myForm">
            <h5 class="text-info"><?php echo $row["p_name"]; ?></h5>
            <h5 class="text-danger">$ <?php echo $row["price"]; ?></h5>

            <input type="hidden" name="quantity" class="form-control" value="1">
            <input type="hidden" name="hidden_name" value="<?php echo $row["p_name"]; ?>">
            <input type="hidden" name="hidden_price" value="<?php echo $row["price"]; ?>">
            <input type="submit" name="add" value="Submit">


</form>
</div>
</div>

Answer 1

您需要使用 JavaScript 而不是传统的表单元素来发出请求。 JS 允许您使用称为 "AJAX." 的技术向您的服务器发出异步请求，而无需刷新用户页面。为了简单起见，这里有一个使用 jQuery 的示例：

$(document).ready(function () {
    $('form.addToCart').on('submit', function(e) {
        e.preventDefault();

        $.ajax({
            url: $(this).attr('action'),
            type: $(this).attr('method'),
            data: $(this).serialize(),

            success: function (data) {
                alert("Item added to cart!");
            },

            error: function (jxhr, text, error) {
                alert(error);
            }
        });
    });
});

（请注意，您不必使用 jQuery 来发出此类异步请求，但它有助于解决访问者可能使用的不同浏览器之间的不一致问题。）

确保您所有的表单标签都有 class "addToCart"，例如：

<form class="addToCart" action="..." method="post"> ...

Answer 2

您可以使用 ajax 提交表单。使用 ajax 提交表单并阻止页面加载

可以使用onForm提交方法

喜欢：

$("#myForm").submit(function(e){
e.preventDefault();
    $.ajax({
            url:'action.php',
            type:"POST",
            data:$("#myForm").serialize(),
            success:function(data){
                $("#snackbar").html(data);
                show_snakbar()
            }

    });
});

您可以使用您的价值观对其进行自定义

如何在当前页面不刷新的情况下在另一页面上 post？

How do I post on another page without the current one refreshing?

html

php

forms

post

shopping