Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Setting Up Cookies For Shopping Cart

Posted on 2003-11-27
3
Medium Priority
?
444 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 500 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

On Demand Webinar: Networking for the Cloud Era

Ready to improve network connectivity? Watch this webinar to learn how SD-WANs and a one-click instant connect tool can boost provisions, deployment, and management of your cloud connection.

Question has a verified solution.

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

For both online and offline retail, the cross-channel business is the most recent pattern in the B2C trade space.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
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…
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.

722 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