Skip to content

Instantly share code, notes, and snippets.

@djoudi

djoudi/app.js

Last active December 3, 2020 10:25
Show Gist options
  • Save djoudi/6c5f8223c60b6c4cb9f794ace9464786 to your computer and use it in GitHub Desktop.
Save djoudi/6c5f8223c60b6c4cb9f794ace9464786 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
app.js
$(document).ready(function() {
var count
console.log(localStorage.key(1));
count = (localStorage.key(1)=='cpt')?localStorage.getItem('cpt'):0
$('.addtocard').text(localStorage.getItem('cpt'))
$(document).on('click', '.cart', function(event) {
event.preventDefault();
count++
localStorage.setItem('cpt', count)
localStorage.setItem('product',$(this).data('title') )
localStorage.setItem('prix',$(this).data('price') )
$('.addtocard').text(localStorage.getItem('cpt'))
//$('.addtocard').text(localStorage.getItem('cpt')+localStorage.getItem('product')+localStorage.getItem('prix'))
});
});
Raw
index.php
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css" >
<title>Cart</title>
</head>
<body>
<div class="container mt-3">
<div class="row">
<div class="col">
<button type="button" class="btn btn-primary">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-cart-check-fill" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M.5 1a.5.5 0 0 0 0 1h1.11l.401 1.607 1.498 7.985A.5.5 0 0 0 4 12h1a2 2 0 1 0 0 4 2 2 0 0 0 0-4h7a2 2 0 1 0 0 4 2 2 0 0 0 0-4h1a.5.5 0 0 0 .491-.408l1.5-8A.5.5 0 0 0 14.5 3H2.89l-.405-1.621A.5.5 0 0 0 2 1H.5zM4 14a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm7 0a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm.354-7.646a.5.5 0 0 0-.708-.708L8 8.293 6.854 7.146a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z"/>
</svg>
<span class="badge badge-light addtocard"></span>
</button>
</div>
</div>
<div class="row mt-5">
<div class="col">
<div class="card">
<img src="img/001.jpg" class="card-img-top" alt="..."> <div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-primary cart">Add To Cart</a>
</div>
</div>
</div>
<div class="col">
<div class="card">
<img src="img/002.jpg" class="card-img-top" alt="..."> <div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-primary cart">Add To Cart</a>
</div>
</div>
</div>
<div class="col">
<div class="card">
<img src="img/003.jpg" class="card-img-top" alt="..."> <div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-primary cart">Add To Cart</a>
</div>
</div>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="js/jquery-3.5.1.min.js" ></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js" ></script>
<script src="js/app.js" ></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment