communauté Apprendre Bibliothèque d'outils Loisirs
recherche
Français
Maison > interface Web > js tutoriel > le corps du texte

Tutoriel détaillé sur la création d'un panier avec Ajax+PHP

php中世界最好的语言
Libérer： 2018-03-31 15:05:07
original
2098 Les gens l'ont consulté

Cette fois je vais vous apporter un tutoriel détaillé sur la création d'un panier avec Ajax+PHP Quelles sont les précautions pour réaliser un panier avec Ajax+PHP Voici un cas pratique, prenons. un regard.

Code de la page Web du panier d'achat, le contenu spécifique est le suivant

1. Interface de connexion login.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../jquery-1.11.2.min.js"></script>
<title>无标题文档</title>
</head>
<body>
<p>用户名：<input type="text" id="uid" /></p>
<p>密码：<input type="text" id="pwd" /></p>
<input type="button" value="登录" id="btn" />
</body>
<script type="text/javascript">
$("#btn").click(function(){
  var uid = $("#uid").val();
  var pwd = $("#pwd").val();
  $.ajax({
      url:"loginchuli.php",
      data:{u:uid,p:pwd},
      type:"POST",
      dataType:"TEXT",
      success: function(data){
        if(data.trim()=="OK")
        {
          window.location.href="main.php" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" ;
        }
        else
        {
          alert("用户名或密码错误");
        }
      }
    })
  })
</script>
</html>
Copier après la connexion

2. >

<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
$uid = $_POST["u"];
$pwd = $_POST["p"];
$sql = "select password from login where username=&#39;{$uid}&#39;";
$mm = $db->StrQuery($sql);
if($mm==$pwd && $pwd!="")
{
  $UserName = $_POST["uid"];
  $_SESSION["uid"]=$uid;
  echo "OK";
}
else
{
  echo "NO";
}
Copier après la connexion
3. Page principale main.php

<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title><br />
<style type="text/css">
.list{ width:100%; height:30px; margin-top:10px; text-align:center; line-height:30px; vertical-align:middle}
</style>
</head>
<body>
<p style="width:100%; height:100px; background-color:#6CC">
  <h1 style="float:left">大苹果商城</h1>
  <a style="float:right; margin-top:40px" href="zhuxiao.php">注销</a>
</p>
<br />
<p style="width:100%; height:600px">
  <p id="left" style="width:20%; float:left">
    <a href="main.php"><p class="list">浏览商品</p></a>
    <a href="zhanghu.php"><p class="list">查看账户</p></a>
    <a href="gouwuche.php"><p class="list">查看购物车</p></a>
  </p>
  
  <p id="right" style="width:80%; float:left">
<?php
  $agwc = array();
  if(!empty($_SESSION["gwc"]))
  {
    $agwc = $_SESSION["gwc"];
  }
  $zhonglei = count($agwc);
  $sum = 0;
  foreach($agwc as $v)
  {
    $sql = "select price from fruit where ids=&#39;{$v[0]}&#39;";
    $danjia = $db->StrQuery($sql);
    $sum = $sum +$danjia*$v[1];
  }
  echo "<p>购物车中有:{$zhonglei}种商品，总价格为:{$sum}元.</p>";
  ?>
    <table width="100%" border="1" cellpadding="0" cellspacing="0">
    <tr>
      <td>代号</td>
      <td>水果名称</td>
      <td>水果价格</td>
      <td>源产地</td>
      <td>库存量</td>
      <td>操作</td>
    </tr>
 <?php   
    $sql = "select * from fruit";
    $attr = $db->Query($sql);
    
    foreach($attr as $v)
    {
      echo "<tr><td>{$v[0]}</td>
      <td>{$v[1]}</td>
      <td>{$v[2]}</td>
      <td>{$v[3]}</td>
      <td>{$v[4]}</td>
      <td><a href=&#39;goumai.php?code={$v[0]}&#39;>购买</a></td></tr>";
    }
    ?>    
    </table>
  </p>
</p>
</body>
</html>
Copier après la connexion
4. Page de traitement des achats goumai.php

<?php
session_start();
$code = $_GET["code"];
if(empty($_SESSION["gwc"]))
{
  //第一次点击购买
  $attr = array(
    array($code,1)
  );
  $_SESSION["gwc"] = $attr;
}
else
{
  //不是第一次点击购买
  $attr = $_SESSION["gwc"];
  $bs=0;
  foreach($attr as $k=>$v)
  {
    if($v[0]==$code)
    {
      $bs=1;
      $attr[$k][1] = $attr[$k][1]+1;
    }
  }
  //如果没有在数组里面出现
  if($bs==0)
  {
    $shuzu = array($code,1);
    $attr[] = $shuzu;
  }
  
  $_SESSION["gwc"]=$attr;
  
}
header("location:main.php");
Copier après la connexion
5. des fruits sélectionnés et des fruits restants. dingdan.php

<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
$uid = $_SESSION["uid"];
$attr = array();
if(!empty($_SESSION["gwc"]))
{
  $attr = $_SESSION["gwc"];
}
//看下两个条件是否都满足
$bs = true;
//判断余额是否满足
  //根据用户名找余额
  $syue = "select account from login where username=&#39;{$uid}&#39;";
  $yue = $db->StrQuery($syue);
  
  //根据购物车数组取总金额
  $sum = 0;
  foreach($attr as $v)
  {
    $sql = "select price from fruit where ids='{$v[0]}'";
    $danjia = $db->StrQuery($sql);
    $sum = $sum +$danjia*$v[1];
  }
  if($yue<$sum)
  {
    $bs = false;
    echo "YEBUZU";
    exit;
  }
  
//判断库存是否满足
foreach($attr as $v)
{
  $skucun = "select name,numbers from fruit where ids=&#39;{$v[0]}&#39;";
  $akucun = $db->Query($skucun);
  if($akucun[0][1]<$v[1])
  {
    $bs = false;
    echo "{$akucun[0][0]}库存不足！";
    exit;
    
  }
}
//添加订单，减库存，减余额
if($bs)
{
  //减库存
  foreach($attr as $v)
  {
    $sql = "update fruit set numbers = numbers-{$v[1]} where ids=&#39;{$v[0]}&#39;";
    $db->Query($sql,0);
  }
  
  //减余额
  $jianyue="update login set account=account-{$sum} where username='{$uid}'";
  $db->Query($jianyue,0);
  
  //添加订单
  $dingdanhao = $uid+date("YmdHis");
  $t = time();
  
  $sorder = "insert into orders values('{$dingdanhao}','{$uid}','{$t}')";
  $db->Query($sorder,0);
  
  foreach($attr as $v)
  {
    $sxq = "insert into orderdetails values('','{$dingdanhao}','{$v[0]}','{$v[1]}')";
    $db->Query($sxq,0);
  }
}
echo "OK";
Copier après la connexion
6. Page du panier

<?php
session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title><br />
<style type="text/css">
.list{ width:100%; height:30px; margin-top:10px; text-align:center; line-height:30px; vertical-align:middle}
</style>
<script src="../../jquery-1.11.2.min.js"></script>
</head>
<body>
<p style="width:100%; height:100px; background-color:#6CC">
  <h1 style="float:left">大苹果商城</h1>
  <a style="float:right; margin-top:40px" href="zhuxiao.php">注销</a>
</p>
<br />
<p style="width:100%; height:600px">
  <p id="left" style="width:20%; float:left">
    <a href="main.php"><p class="list">浏览商品</p></a>
    <a href="zhanghu.php"><p class="list">查看账户</p></a>
    <a href="gouwuche.php"><p class="list">查看购物车</p></a>
  </p>
  
  <p id="right" style="width:80%; float:left">
    <table width="100%" border="1" cellpadding="0" cellspacing="0">
    <tr>
      <td>商品名称</td>
      <td>商品单价</td>
      <td>购买数量</td>
      <td>操作</td>
    </tr>
<?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $attr=array();
    if(!empty($_SESSION["gwc"]))
    {
      $attr = $_SESSION["gwc"];
    }
    
    foreach($attr as $k=>$v)
    {
      $sql = "select name,price from fruit where ids='{$v[0]}'";
      $ashuiguo = $db->Query($sql);
    
      echo "<tr><td>{$ashuiguo[0][0]}</td><td>{$ashuiguo[0][1]}</td><td>{$v[1]}</td><td><a href=&#39;shanchu.php?sy={$k}&#39;>删除</a></td></tr>";
      
    }
    
    ?>
    </table>
    <p id="tj">提交订单</p><p id="ts"></p>
  </p>
</p>
<script type="text/javascript">
$("#tj").click(function(){
    $.ajax({
        url:"dingdan.php",
        dataType:"TEXT",
        success: function(data){
            if(data.trim()=="OK")
            {
              alert("购买成功");
            }
            else if(data.trim()=="YEBUZU")
            {
              $("#ts").html("余额不足");
              $("#ts").css("color","red");
            }
            else
            {
              $("#ts").html(data);
              $("#ts").css("color","red");
            }
          }
      });
  })
</script>
</body>
</html>
Copier après la connexion
7. Page de traitement de la suppression de la page du panier shanchu.php

<?php
session_start();
$sy = $_GET["sy"];
$attr = $_SESSION["gwc"];
if($attr[$sy][1]>1)
{
  $attr[$sy][1] = $attr[$sy][1]-1;
}
else
{
  unset($attr[$sy]);
  $attr = array_values($attr);
}
$_SESSION["gwc"]=$attr;
header("location:gouwuche.php");
8.账户余额页面zhanghu.php
<?php
session_start();
$uid = $_SESSION[&#39;uid&#39;];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title><br />
<style type="text/css">
.list{ width:100%; height:30px; margin-top:10px; text-align:center; line-height:30px; vertical-align:middle}
</style>
</head>
<body>
<p style="width:100%; height:100px; background-color:#6CC">
  <h1 style="float:left">大苹果商城</h1>
  <a style="float:right; margin-top:40px" href="zhuxiao.php">注销</a>
</p>
<br />
<p style="width:100%; height:600px">
  <p id="left" style="width:20%; float:left">
    <a href="main.php"><p class="list">浏览商品</p></a>
    <a href="zhanghu.php"><p class="list">查看账户</p></a>
    <a href="gouwuche.php"><p class="list">查看购物车</p></a>
  </p>  
  <p id="right" style="width:80%; height:150px; float:left">
<?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $sql = "select Account from login where UserName=&#39;{$uid}&#39;";
    $result = $db->strQuery($sql);
    
    echo ("您的账户中还剩余".$result);
  ?>
  </p>
</p>
</body>
</html>
Copier après la connexion
Je crois que vous l'avez fait. lisez cet article Vous maîtrisez la méthode des cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web PHP chinois !

Lecture recommandée :

Comment implémenter l'effet de pagination AJAX

Obtenir un chargement infini de listes et de menu déroulant secondaire options Ajax (avec code)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées：
php 购物车
source：php.cn
Article précédent：Explication graphique détaillée des problèmes inter-domaines ajax (avec code) Article suivant：Le cœur de la technologie Ajax et les attributs de la méthode
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Les tableaux PHP obtenus à partir des paramètres d'URL ne se comportent pas comme prévu J'ai un paramètre d'URL qui contient l'identifiant de la catégorie et je souhaite le trait...
Depuis 2024-04-06 22:09:02
0
1
1428
Où dois-je placer la directive CustomLog dans Apache J'utilise php:7.2-apachedocker. Je dois désactiver le journal d'accès à la connexion à l'U...
Depuis 2024-04-06 22:03:59
0
1
990
Quel est le format des variables dans la valeur de retour ? Je suis un nouvel apprenant de php. J'ai trouvé un morceau de code : if($x<time()){retu...
Depuis 2024-04-06 21:55:20
0
1
778
Problèmes rencontrés lors de l'utilisation d'opentbs pour générer des fichiers odt : les valeurs d'une même clé sont affichées dans la même ligne au lieu de colonnes séparées. J'utilise une bibliothèque appelée OpenTbs pour créer odt en utilisant PHP, je l'utilise c...
Depuis 2024-04-06 20:18:18
0
1
483
Regrouper les résultats MySQL par ID pour effectuer une boucle J'ai une table avec des données de vol dans MySQL. J'écris un code php qui regroupera et a...
Depuis 2024-04-06 17:27:56
0
1
406
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal