您的位置:首页 > 其它

Ajax 异步小demo

2017-12-03 14:12 225 查看

前端操作

增加购物车的ajax发送

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ajax Demo2</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<input name="number" type="text" id="number" value="1" size="4" onblur="" style="border:1px solid #ccc">
<strong>商品总价 <?=3000?>元</strong>
<a href="javascript:addCart(1)">加入购物车</a>

<div id="msg"></div>

</body>
<script>
function addCart(productid){
//ajax请求php脚本完成添加数据到shop_cart表当中
//post更安全,可以传输更多数据,格式如下:  $.post(url,data,success,"json");
var url = 'demo2.php';
var data = {'productid':1,'num':parseInt( $("#number").val() )};
//var success = function(response){
alert(response);
// $("#msg").html(response);
if(response.error==0){
alert('添加成功');
}else{
alert('添加失败');
}
}
$.post(url,data,success,"json");
}
</script>
</html>


后端操作

客户传输的数据,注意处理数据

没有真实链接数据库,下面代码仅作参考

加入购物车操作,主要是操作下面4个步骤

<?php
# 1. 接受传递过来的post参数
$id = intval(strip_tags($_POST['id']));
$num = intval(strip_tags($_POST['num']));

#2. 准备要添加如购物车的参数
session_start();
$userid = $_SESSION['mumberid'];
try{
$pdo = new POD( "mysql:host = localhost;dbname=mooc","root","password",array(POD::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION) );
$pdo->query("set names  utf8");
$sql = "select price from shop_product where id=?";
$stmt = $pdo->prepare($sql);
$stmt = execute(array($productid));
$data = $stmt->fetch(PDO::FETCH_ASSOC);
// var_dump($data);
$price = $data['price'];
$createtime = time();

#3. 完成购物车添加
$sql = "insert into shop_cart(productid,num,userid,price,createtime) values(?,?,?,?,?)";
$stmt = $pdo->prepare($sql);
$stmt->excute(array($productid,$num,$userid,$price,$createtime));
$rows = $stmt->rowCount(); #获取受影响函数

}catch(PDOException $e){
echo $e->getMessage();
}

# 4. 返回最终结果

if($rows){
$response = array(
'error' = 0,
'errmsg' => '添加成功',
'data' => true
);
}else{
$response = array(
'error' = -1,
'errmsg' => '添加失败',
'data' => false
);
}

echo json_encode($response);
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  ajax 异步