[SalesForce] Delete cookie data

I've created a cookie as shown and append any newly added data to the cookie:

if (cart == null) {
               //Create an instance of the cookieJar class, passing it the values entered in the fields
                cookieJar c = new cookieJar(p.productid, selSize, selColour, String.valueOf(p.qtyToBuy));          
            } else {   //Append cookie
               String pid = cart.getValue();
               String psize = cart2.getValue();
               String pqty = cart3.getValue();
               String pcol = cart4.getValue();

               cookieJar c = new cookieJar(p.productid + ',' + pid, selSize + ',' + psize, selColour + ',' + pcol ,String.valueOf(p.qtyToBuy) + ',' + pqty);

            }

I would like to delete the cookie data based on the productid. Is there way to do so?
I understand from documentation that After you create a cookie, the properties of the cookie can't be changed.
Does that mean that I can't delete the cookie?

On the other hand, I've tried using Javascript on my VF page to delete the particular cookie with product id, but it doesn't seems to work.

        <apex:column headerValue="Product" value="{!item.Name}"/>
       <apex:column headerValue="Colour" value="{!item.Color}"/> 
       <apex:column headerValue="Size" value="{!item.Size}"/> 
       <apex:column headerValue="Quantity">
            <apex:outputText value="{!item.qtyToBuy}" />
        </apex:column>

          <apex:column headerValue="Remove">
          <apex:commandLink action="{!removecon}" reRender="s" >
          <apex:param assignTo="{!conid}" value="{!item.productid}" name="assignvalue" />Remove </apex:commandLink> 
        <apex:actionSupport event="onclick" oncomplete="deletecook();" reRender="s" />
        </apex:column>

        </apex:pageblocktable>        
    </apex:pageblock>

  <script>
function deletecook() {
document.cookie = "productid='{!conid}'; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
 alert(document.cookie);
 }

Cookie Jar Class

public class cookieJar {


        // The controller extension does the work
        public cookieJar(String productid, String productsize, String productcolour, String qtyToBuy) {

            Cookie pId = new Cookie('productid', productid,null,-1,false);
            Cookie pSize = new Cookie('productSize', productsize,null,-1,false);
            Cookie qty = new Cookie('qtyToBuy', qtyToBuy,null,-1,false);
            Cookie pCol = new Cookie('productColour', productcolour,null,-1,false);

            //Set the page cookies using the setCookies() method
            ApexPages.currentPage().setCookies(new Cookie[]{pId, pSize, pCol, qty});

        }


    }//end cookieJar inner class
}

Any help will be greatly appreciated, Thanks guys!

Best Answer

You just have to set the maxAge value to zero, which is the equivalent of the standard way of setting the expiry date on the past.

From the documentation: Cookie Class

MaxAge: A number representing how long a cookie is valid for in seconds. If set to less than zero, a session cookie is issued. If set to zero, the cookie is deleted.

E.g. based on cookie set in cookieJar

Cookie pId = new Cookie('productid', '',null,0,false); // Note the 0 to delete the cookie
ApexPages.currentPage().setCookies(new Cookie[]{pId});