带有带预选选项的下拉列表的Shoppingcart
[英]Shoppingcart with a drop-down list with a pre-selected option
问题描述
我现在有什么
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> Simple PHP Mysql Shopping Cart</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<br />
<div class="container" style="width:700px;">
<h3 align="center">LS-Net Shopping Cart</h3><br />
<?php
$query = "SELECT * FROM tbl_product ORDER BY id ASC";
$result = mysqli_query($connect, $query);
if(mysqli_num_rows($result) > 0)
{
while($row = mysqli_fetch_array($result))
{
?>
<div class="col-md-4">
<form method="post" action="index.php?action=add&id=<?php echo $row["id"]; ?>">
<div style="border:1px solid #333; background-color:#f1f1f1; border-radius:5px; padding:16px;" align="center">
<img src="<?php echo $row["image"]; ?>" class="img-responsive" /><br />
<h4 class="text-info"><?php echo $row["name"]; ?></h4>
<h4 class="text-danger">DKK <?php echo $row["price"]; ?></h4>
<input type="text" name="quantity" class="form-control" value="1" />
<input type="hidden" name="hidden_name" value="<?php echo $row["name"]; ?>" />
<input type="hidden" name="hidden_price" value="<?php echo $row["price"]; ?>" />
<input type="submit" name="add_to_cart" style="margin-top:5px;" class="btn btn-success" value="Add to Cart" />
</div>
</form>
</div>
<?php
}
}
?>
<div style="clear:both"></div>
<br />
<h3>Order Details</h3>
<div class="table-responsive">
<table class="table table-bordered">
<tr>
<th width="40%">Item Name</th>
<th width="10%">Quantity</th>
<th width="20%">Price</th>
<th width="15%">Total</th>
<th width="5%">Action</th>
</tr>
<?php
if(!empty($_SESSION["shopping_cart"]))
{
$total = 0;
foreach($_SESSION["shopping_cart"] as $keys => $values)
{
?>
<tr>
<td><?php echo $values["item_name"]; ?></td>
<td><?php echo $values["item_quantity"]; ?></td>
<td>DKK <?php echo $values["item_price"]; ?></td>
<td>DKK <?php echo number_format($values["item_quantity"] * $values["item_price"], 2); ?></td>
<td><a href="index.php?action=delete&id=<?php echo $values["item_id"]; ?>"><span class="text-danger">Remove</span></a></td>
</tr>
<?php
$total = $total + ($values["item_quantity"] * $values["item_price"]);
}
?>
<tr>
<td colspan="3" align="right">Total</td>
<td align="right">DKK <?php echo number_format($total, 2); ?></td>
<td></td>
</tr>
<?php
}
?>
</table>
</div>
</div>
<br />
</body>
</html>
<?php
session_start();
$connect = mysqli_connect("localhost", "root", '', "test");
$connect = new mysqli("localhost", "root", "", "test");
$connect->set_charset("utf8");
if(isset($_POST["add_to_cart"]))
{
if(isset($_SESSION["shopping_cart"]))
{
$item_array_id = array_column($_SESSION["shopping_cart"], "item_id");
if(!in_array($_GET["id"], $item_array_id))
{
$count = count($_SESSION["shopping_cart"]);
$item_array = array(
'item_id' => $_GET["id"],
'item_name' => $_POST["hidden_name"],
'item_price' => $_POST["hidden_price"],
'item_quantity' => $_POST["quantity"]
);
$_SESSION["shopping_cart"][$count] = $item_array;
}
else
{
echo '<script>alert("Item Already Added")</script>';
echo '<script>window.location="index.php"</script>';
}
}
else
{
$item_array = array(
'item_id' => $_GET["id"],
'item_name' => $_POST["hidden_name"],
'item_price' => $_POST["hidden_price"],
'item_quantity' => $_POST["quantity"]
);
$_SESSION["shopping_cart"][0] = $item_array;
}
}
if(isset($_GET["action"]))
{
if($_GET["action"] == "delete")
{
foreach($_SESSION["shopping_cart"] as $keys => $values)
{
if($values["item_id"] == $_GET["id"])
{
unset($_SESSION["shopping_cart"][$keys]);
echo '<script>alert("Item Removed")</script>';
echo '<script>window.location="index.php"</script>';
}
}
}
}
?>
我正在尝试将我的所有3个框合并为一个框，因此仅显示一个框，我想这应该足够简单。
但是，如何在<h4>和价格之间创建一个下拉列表？ 例; 当您选择“里尔摩亚”时，它会将下面的价格更改为“里尔摩亚”价格。 当您从下拉菜单中选择内容时，图像不相关，以便进行更改。 您可以查看附件中的图像，以使其形象化。
谢谢。 :-)
1 个解决方案
解决方案1
0 2018-05-11 08:37:14
Like this?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>LS-net Cart</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<br />
<div class="container" style="width:700px;">
<h3 align="center">Simple PHP Mysql Shopping Cart</h3><br />
<div class="col-md-4">
<form method="post" action="index.php?action=add&id=1">
<div style="border:1px solid #333; background-color:#f1f1f1; border-radius:5px; padding:16px;" align="center">
<img src="1.jpg" class="img-responsive" /><br />
<h4 class="text-info">Fodboldmål</h4>
<h4 class="text-danger">DKK 595.00</h4>
<input type="text" name="quantity" class="form-control" value="1" />
<input type="hidden" name="hidden_name" value="Fodboldmål" />
<input type="hidden" name="hidden_price" value="595.00" />
<input type="submit" name="add_to_cart" style="margin-top:5px;" class="btn btn-success" value="Add to Cart" />
</div>
</form>
</div>
<div class="col-md-4">
<form method="post" action="index.php?action=add&id=2">
<div style="border:1px solid #333; background-color:#f1f1f1; border-radius:5px; padding:16px;" align="center">
<img src="2.jpg" class="img-responsive" /><br />
<h4 class="text-info">Træning</h4>
<h4 class="text-danger">DKK 375.00</h4>
<input type="text" name="quantity" class="form-control" value="1" />
<input type="hidden" name="hidden_name" value="Træning" />
<input type="hidden" name="hidden_price" value="375.00" />
<input type="submit" name="add_to_cart" style="margin-top:5px;" class="btn btn-success" value="Add to Cart" />
</div>
</form>
</div>
<div class="col-md-4">
<form method="post" action="index.php?action=add&id=3">
<div style="border:1px solid #333; background-color:#f1f1f1; border-radius:5px; padding:16px;" align="center">
<img src="3.jpg" class="img-responsive" /><br />
<h4 class="text-info">Lille mål</h4>
<h4 class="text-danger">DKK 299.00</h4>
<input type="text" name="quantity" class="form-control" value="1" />
<input type="hidden" name="hidden_name" value="Lille mål" />
<input type="hidden" name="hidden_price" value="299.00" />
<input type="submit" name="add_to_cart" style="margin-top:5px;" class="btn btn-success" value="Add to Cart" />
</div>
</form>
</div>
<div style="clear:both"></div>
<br />
<h3>Order Details</h3>
<div class="table-responsive">
<table class="table table-bordered">
<tr>
<th width="40%">Item Name</th>
<th width="10%">Quantity</th>
<th width="20%">Price</th>
<th width="15%">Total</th>
<th width="5%">Action</th>
</tr>
</table>
</div>
</div>
<br />
</body>
</html>
根据另一个下拉列表中的所选选项更改下拉列表中的项目
[英]Change items in a drop-down list depending on the selected option in another drop-down list
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.