Solved

Setting Up Cookies For Shopping Cart

Posted on 2003-11-27
3
424 Views
Last Modified: 2013-11-29
All right here is the problem.

Trying to creat a shopping page that has three products.
I want the cookies to store the product name and a running quantity.
On "Add Item" button, it needs to check if the cookie is there.
If cookie is not there, create cookie with a value (quantity) of 1.  
If cookie is present and 1 to current value (quantity).

I am having two problems with current code.

Problem 1:
The code I am using now writes over present cookie value with new value.
Ex.
Click on "Product 1".  Cookie is added for Product 1 with quanity of 1.
Next.
Click on "Product 2".  Cookie is overwritten.  Product 1 information is lost.  Prosuct 2 information is written.

Problem 2:
Values (Quantity) is added together as strings instead on integers.  I have tried parseInt() and parseFloat() in various places with no luck.
Ex.
Click on "Product 1".  Cookie is added for Product 1 with quanity of 1.
Next.
Click on "Product 1" again.  Cookie is added for Product 1 with quanity of 11.
Next.
Click on "Product 1" again.  Cookie is added for Product 1 with quanity of 111.
Etc.

Here is the HTML page and code I am using:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
      <title>JavaScript Cookies - Widgets</title>
      <SCRIPT LANGUAGE="JavaScript">
      var date = new Date("December 31, 2023");
    var cookieDate = date.toGMTString();

      function addItem(itemName) {
                  var cookieContent;
                  var counterValue = readCookie(itemName);
                  //this is where I have been trying the parseInt, parseFloat
                  quantity = counterValue;
                  quantity = quantity + 1;
            // I had to do this because on every click of the same item it would add a : Ex. Product1::11
                  cookieContent = itemName + ":";
                  document.cookie = cookieContent  + quantity + ";expires=" + cookieDate + ";";

                  function readCookie(itemName) {
                        var docCookies = document.cookie;
                        var startIndex = docCookies.indexOf(itemName);
                              if (startIndex == -1) {
                              cookieContent = itemName + ":";
                  document.cookie = cookieContent  + "1" + ";expires=" + cookieDate + ";";
                              };
                        startIndex += itemName.length + 1;
                        var endIndex = docCookies.indexOf(";",startIndex);
                        if (endIndex == -1) endIndex = docCookies.length;
                        var cookieValue = docCookies.substring(startIndex, endIndex);
                        return cookieValue;
            }
}
</SCRIPT>
      
</head>

<body>
<h3>Product 1</h3>
<p>Price - $150.00, Shipping - $10.95</p>
<a href='javascript:addItem("Product1")'>Put In Shopping Cart</a><br>
<br>

<h3>Product 2</h3>
<p> Price - $150.00, Shipping - $ 10.95</p>
<a href='javascript:addItem("Product2")'>Put In Shopping Cart</a> <br>
<br>

<h3>Product 3</h3>
<p>Price - $150.00, Shipping - $10.95</p>
<p><a href='javascript:addItem("Product3")'>Put In Shopping Cart</a>&nbsp;</p>
<p><a href="javascript:alert(document.cookie);">View Cookies</a></p>
</body>
</html>

I want to write the cookie something like this:

Product1:2;Product2:1;Product3:4;

Meaning: Product1 has quantity of 2; Product2 has quantity of 1; Product3 has quantity of 4

On the cart page I will try and parse out each item with a quantity value for each and then assign price * quanity for a total.

Sorry, all I have to give is 125 points.

Thanks in advance for any help.
0
Comment
Question by:brianindium
  • 2
3 Comments
 
LVL 5

Accepted Solution

by:
apparition earned 125 total points
ID: 9832666
The code below should do what you are trying to accomplish

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
     <title>JavaScript Cookies - Widgets</title>
     <SCRIPT LANGUAGE="JavaScript">
     // create an instance of the Date object
      var now = new Date();
      // fix the bug in Navigator 2.0, Macintosh
      fixDate(now);
      // cookie expires in one year (actually, 365 days)
      // 365 days in a year
      // 24 hours in a day
      // 60 minutes in an hour
      // 60 seconds in a minute
      // 1000 milliseconds in a second
      now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);


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

function getCookie(name) {
  var dc = document.cookie;
  var prefix = name + "=";
  var begin = dc.indexOf("; " + prefix);
  if (begin == -1) {
    begin = dc.indexOf(prefix);
    if (begin != 0) return null;
  } else
    begin += 2;
  var end = document.cookie.indexOf(";", begin);
  if (end == -1)
    end = dc.length;
  return unescape(dc.substring(begin + prefix.length, end));
}

function fixDate(date) {
  var base = new Date(0);
  var skew = base.getTime();
  if (skew > 0)
    date.setTime(date.getTime() - skew);
}

function addItem(Prod) {
      var quantity = getCookie(Prod);
      if (!quantity) {
             quantity = 1; // the value for the new cookie
      
      } else {
        // increment the counter
        quantity = parseInt(quantity) + 1;
      }
      // set the new cookie
      setCookie(Prod, quantity, now);

}
</SCRIPT>
     
</head>

<body>
<h3>Product 1</h3>
<p>Price - $150.00, Shipping - $10.95</p>
<a href='javascript:addItem("Product2")'>Put In Shopping Cart</a><br>
<br>

<h3>Product 2</h3>
<p> Price - $150.00, Shipping - $ 10.95</p>
<a href='javascript:addItem("Product2")'>Put In Shopping Cart</a> <br>
<br>

<h3>Product 3</h3>
<p>Price - $150.00, Shipping - $10.95</p>
<p><a href='javascript:addItem("Product3")'>Put In Shopping Cart</a>&nbsp;</p>
<p><a href="javascript:alert(document.cookie);">View Cookies</a></p>
</body>
</html>
0
 
LVL 5

Expert Comment

by:apparition
ID: 9832674
ooops made a mistake at the bottom HTML for product 1


<h3>Product 1</h3>
<p>Price - $150.00, Shipping - $10.95</p>
<a href='javascript:addItem("Product1")'>Put In Shopping Cart</a><br>
<br>

It was
<h3>Product 1</h3>
<p>Price - $150.00, Shipping - $10.95</p>
<a href='javascript:addItem("Product2")'>Put In Shopping Cart</a><br>
<br>


0
 

Author Comment

by:brianindium
ID: 9832714
You are a pimp and a scholar.

Thanks.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Read about how to choose the best possible content marketing agency to suit your needs. Content marketing has become an integral part of running a successful tech business, so it is wise to be informed.
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
This video explains how to create simple products associated to Magento configurable product and offers fast way of their generation with Store Manager for Magento tool.
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

920 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

16 Experts available now in Live!

Get 1:1 Help Now