Solved

Setting Up Cookies For Shopping Cart

Posted on 2003-11-27
3
432 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

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.
For both online and offline retail, the cross-channel business is the most recent pattern in the B2C trade space.
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…

740 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