Solved

How do I add remove item buttons in my JavaScript shopping cart?

Posted on 2010-11-22
2
312 Views
Last Modified: 2012-05-10
I have wrote the following 2 JavaScript codes for a shopping cart. I need to know how to add 3 remove buttons so that the 3 products can be removed by the user from the shopping cart.
detail.html
cart.html
0
Comment
Question by:jbosarg
  • 2
2 Comments
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 500 total points
Comment Utility
1. change
<a href="javascript:place('1 - 10 count bag of Red Balloons')">Put In Shopping Cart</a>&nbsp;&nbsp;

to

<a href="#" onclick="return place('1 - 10 count bag of Red Balloons')">Put In Shopping Cart</a>&nbsp;&nbsp;

2. add

<a href="#" onclick="return remove('1 - 10 count bag of Red Balloons')">Remove from Shopping Cart</a>&nbsp;&nbsp;


3 change
function place(new_item){
  balloons_string = balloons_string + "xxx" + new_item;
  document.cookie = "balloons=" + escape(balloons_string);
}

to

function place(new_item){
  var balloons_string = getCookie('balloons');
  balloons_string += "xxx" + new_item;
  setCookie("balloons",balloons_string);
}
function remove(new_item){
  var balloons_string = getCookie('balloons');
  balloons_string = balloons_string.replace("xxx" + new_item,""); // remove once
  setCookie("balloons",balloons_string);
}

and use this code:

// cookie.js file
var cookieToday = new Date(); 
var expiryDate = new Date(cookieToday.getTime() + (365 * 86400000)); // a year

/* Cookie functions originally by Bill Dortsch */

function setCookie (name,value,expires,path,theDomain,secure) { 
   value = escape(value);
   var theCookie = name + "=" + value + 
   ((expires)    ? "; expires=" + expires.toGMTString() : "") + 
   ((path)       ? "; path="    + path   : "") + 
   ((theDomain)  ? "; domain="  + theDomain : "") + 
   ((secure)     ? "; secure"            : ""); 
   document.cookie = theCookie;
} 

function getCookie(Name) { 
   var search = Name + "=" 
   if (document.cookie.length > 0) { // if there are any cookies 
      var offset = document.cookie.indexOf(search) 
      if (offset != -1) { // if cookie exists 
         offset += search.length 
         // set index of beginning of value 
         var end = document.cookie.indexOf(";", offset) 
         // set index of end of cookie value 
         if (end == -1) end = document.cookie.length 
         return unescape(document.cookie.substring(offset, end)) 
      } 
   } 
} 
function delCookie(name,path,domain) {
   if (getCookie(name)) document.cookie = name + "=" +
      ((path)   ? ";path="   + path   : "") +
      ((domain) ? ";domain=" + domain : "") +
      ";expires=Thu, 01-Jan-70 00:00:01 GMT";
}

Open in new window

0
 
LVL 75

Expert Comment

by:Michel Plungjan
Comment Utility
you will need to update the cart to use the same cookie script and do :
<script type="text/javascript" src="cookie.js"></script>
<script language="javascript">
  var whole_balloon_cookie = getCookie("balloons");
  if (whole_balloon_cookie == null || whole_balloon_cookie =="") alert("You haven't ordered anything.");
  function process_cookie(){
    if (whole_balloon_cookie != "") {
      balloon_array = whole_balloon_cookie.split("xxx");
      if (balloon_array.length < 2) {
        balloon_array = "";
      }
    }
    window.location = "cart.html";
  }
</script>

Open in new window

0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

743 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now