我的朋友,
我正面临着Ajax& amp; PHP集成。我有一个简单的代码,从数据库返回数据并显示为div class =“item-list”。当用户输入数量并点击提交按钮时,所选项目将上传到div class =“returned”,就像“添加商品到购物车”功能一样。代码也正常工作(从列表中添加和删除),但只能在页面上刷新。 我在网上看到很多例子,我试图让它们适应我的代码(今天是我的第三天战斗),但没有成功。你可以告诉我一种方法将所选项加载到div class =“return”而不刷新页面吗?
最好的问候&非常感谢!
<?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: <?php echo $row["model"]; ?></span>
<span>Price: <?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" ?>
答案 0 :(得分:0)
我尝试使示例不那么复杂,并使其与您已创建的代码一起使用。
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: <?php echo $row["model"]; ?></span>
<span>Price: <?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";