購物車基本功能:商品的添加、修改、刪除、結算、和分頁查詢
文件的基本組織形式:phone_index.php(商品的展示,這裏有商品添加按鈕)
phone_index.js(實現商品添加的js,利用Ajax請求數據)
shopcar_accept.php(接受商品添加的ajax請求,訪問數據庫並且添加數據,最後返回狀態碼)
添加細節展示
phone_index.php
<body>
<?php include("index_top_nav.php")?>
<div class = "wrap">
<nav class="navbar navbar-default">
<p class="navbar-text p1">商品</p>
<p class="navbar-text p2">價格</p>
<p class="navbar-text p3">庫存</p>
<p class="navbar-text p4">操作</p>
</nav>
<?php
$connID = mysqli_connect("127.0.0.1","root","","shop");
mysqli_query($connID,"set names utf8");
$query = "select id,name,price,number from phone";
$result = mysqli_query($connID,$query);
while($arr = mysqli_fetch_array($result,MYSQLI_NUM)){
?>
<div class="panel panel-default">
<div class = " img"><img src="image/20191001.jpg" alt="..."/></div>
<div class = "panel-body id"><?php echo $arr[0];?></div>
<div class = "panel-body name"><?php echo $arr[1];?></div>
<div class = "panel-body price"><?php echo $arr[2];?></div>
<div class = "panel-body number"><?php echo $arr[3];?></div>
<div class = "panel-body caozuo">
<button type="button" class="btn btn-default">加入購物車</button>
<button type="button" class="btn btn-default">詳細信息</button>
</div>
</div>
<?php
}
?>
</div>
</body>
上面訪問的數據是已經定義好的,數據是已經存在的.
添加功能(phone_index.js 請求 shopcar_accept.php) 實現
var allAddCarBtn = document.getElementsByTagName("button");
function BtnAddEvent(){
for(var i=0;i<allAddCarBtn.length;i++){
allAddCarBtn[i].addEventListener("click",function(){
var comId = this.parentNode.parentNode.firstElementChild.nextElementSibling.innerHTML;
console.log(comId);
getData(comId);
})
}
}
BtnAddEvent();
//Ajax傳送數據
function getData(dataById){
var xmlHttp = new XMLHttpRequest();
var url = "shopcar_accept.php?id="+dataById;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
xmlHttp.onreadystatechange = function(){
if(xmlHttp.status == 200 && xmlHttp.readyState == 4){
console.log(xmlHttp.responseURL);
if(xmlHttp.responseText == "1"){
alert("請登錄...");
location.href = "login.php";
}
if(xmlHttp.responseText == "2"){
alert("該商品已經存在...");
}
if(xmlHttp.responseText == "0"){
alert("插入成功...");
}
}
}
}
給所有的添加按鈕綁定事件,並且根據隱藏的存儲商品id的DOM來指定需要添加的數據.最後根據狀態來先顯示信息.
<?php
//創建session
session_start();
header('content-type:text/html;charset=GB2312');
if(!isset($_SESSION["name"])){
echo "1";//用戶尚未登錄
exit;
}else{
include("conn/conn.php");
//判斷用戶的購物車數據表是否存在
$userTableName = $_SESSION["name"]."_car";
//判斷該用戶的表是否存在 如果不存在則創建它
$select = "CREATE TABLE `".$userTableName."` (
`name` varchar(50) NOT NULL,
`price` int(5) NOT NULL,
`number` int(3) NOT NULL,
`total` int(6) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=gbk";
$result = mysqli_query($connID,"SHOW TABLES LIKE '". $userTableName."'");
$num = mysqli_num_rows($result);
if($num == 0){
mysqli_query($connID,$select);
}
//連接該商品的數據庫
//找到該數據 找到是肯定的
$select = "SELECT name,price FROM allshop WHERE id = '".$_GET['id']."'";
$result = mysqli_query($connID,$select);
//$arr爲需要添加的商品
$arr = mysqli_fetch_array($result);
//現在購物車shopcarbyeveryone中查詢該商品是否存在
//如果存在 則提示用戶商品已經存在 如果不存在 則添加該商品 並顯示提示信息
$select = "SELECT name FROM ".$userTableName." WHERE name = '".$arr[0]."'";
$result = mysqli_query($connID,$select);
$num = mysqli_num_rows($result);
if($num>0){
echo "2"; //商品已經存在
}else{
//不存在該商品 插入
$select = "INSERT INTO `".$userTableName."`(`name`, `price`, `number`, `total`) VALUES ('".$arr[0]."',".$arr[1].","."1,".$arr[1].")";
$result = mysqli_query($connID,$select);
if($result){
echo "0";
}
}
}
?>
基本思路:首先判斷用戶是否登錄,若沒有登錄則跳轉到登錄頁面,若登錄判斷屬於該用戶的購物車數據表是否存在,若不存在則創建,若存在則根據ajax傳送來的數據判斷該商品是否已經存在,若不存在實現添加功能。最後返回轉態碼到用responseText返回到js顯示提示信息.