How to Remove a Cookie on Submit?

Question

Good day,

I'm trying to remove the cookie when submitting the form, but its not working.

Here is my code:

$("form").submit(function()
{

  var cookiePath = "Table_Rows-"+$(location).attr('pathname');
  alert(cookiePath);
  $.removeCookie(cookiePath);
}

Even if I delete all cookies using these code, it still won't work:

 $("form").submit(function()
{
  for (var it in $.cookie()) $.removeCookie(it);
}

Im setting my data to be save on a cookie via onbeforeuload function

window.onbeforeunload = function(event)
{
storeRowData();
console.log("cookie saved!");
};

and here's my StoreData() js

var storeRowData = function () {
 var data = []; 
$('#tblItemList tbody>tr').each(function () {
    var $this = $(this),

        pId = $this.find("#itemId").val();
        pname = $this.find('input.itemSearch').attr("value"),
        desc = $this.find(".description").val(),
        quant = $this.find(".qty").val(),
        rowId = $this.find(".rowId").val(),
        deleted = $this.find(".hidden-deleted-id").val(),
        price = $this.find(".price").val();

    var temp = { 
        productName: pname, 
        itemId:pId,
        description: desc,
        quantity: quant, 
        price: price,
        deleted:deleted, 
        rowId: rowId };
    data.push(temp);
});
var cookiePath = 'Table_Rows-'+$(location).attr('pathname');
$.cookie(cookiePath, JSON.stringify(data), {expires: 7});
}

then im checking if cookie was set on the page on document.ready function:

if($.cookie('Table_Rows-'+$(location).attr('pathname'))){
loadCookieData();
$(".qty, .price").bind("keyup change", calculate);
}
else{
addRow(0);
}

and my loadCookieData()

var cookiePath = 'Table_Rows-'+$(location).attr('pathname');
//console.log("loadCookieData:"+cookiePath);
temp = $.cookie(cookiePath);
var parseData = JSON.parse(temp);
//console.log(parseData);
var html ='';



for (i in parseData) {

    subTotal = parseData[i].quantity*parseData[i].price;
    var st = new Number(subTotal);
    var sub = st.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');

    html+= (some html code to replace here)   
 }
$("#tblItemList tbody").html(html);

  for (i in parseData){
  var inputBox = "#itemName"+parseData[i].rowId;
  $(inputBox).select2(sOptions);
}
calculate(); 
}

Is there something wrong with my current code ??

Can anyone tell me how to properly do it please? Thank you very much!

yes it is the cookieName and alert's also showing @VIDesignz — melvnberd, Feb 11 '14 at 22:04
try this http://stackoverflow.com/questions/3671659/jquery-delete-cookies — Works On Mine, Feb 11 '14 at 22:05
Note: some cookie can not be modified/deleted if you are not on the same subdomain/domain or path as the cookie was set for, if i remember corectly. — Endless, Feb 11 '14 at 22:06
@Endless But Im still on the same page, anyway thanks for the tip. (y) — melvnberd, Feb 11 '14 at 22:15
sometimes simple javascript is just easier `$(location).attr('pathname')` -> `location.pathname` — Endless, Feb 11 '14 at 22:40
@Endless I see the point :) , will that affect the behavior my code as well? I mean if Ill use simple javascript instead of jquery, will it make difference? — melvnberd, Feb 11 '14 at 22:45
Could it be that you are deleting the cookie and setting it back onbeforeunload? — Endless, Feb 11 '14 at 22:52
hmmm.. I guess that whats happening, yeah I think submit will be override by the onbeforeunload right? can you please suggest on what should I do so I can actually delete it I mean override that onbeforeunload? Im setting it to onbeforeunload so the data will still remain even I do refresh or redirect to other page and then go back. — melvnberd, Feb 11 '14 at 22:54
My suggestion would be not to use onbeforeunload at all sense its has some issues in some browsers or versions of browsers. i think opera didn't even had it until they changed to webkit if it isn't a problem for you, you can do either `onbeforeunload = null` or `storeRowData = $.noop` — Endless, Feb 11 '14 at 23:10
finally solved it! thank you very much for seeing that onbeforeunload thing! I did by adding `window.onbeforeunload = false` on submit funtion and it worked! did it because of your help! Really appreciate it! — melvnberd, Feb 11 '14 at 23:14

Endless · Accepted Answer · 2014-02-11T22:43:20.877

1

Changed my answer sience its not a restricting problem anymore

document.cookie = cookiePath + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT";

edited Feb 11 '14 at 22:43

answered Feb 11 '14 at 22:15

Endless

34,080
13
108
131

will I add this code on my .submit function? sorry Im a little confuse :3 – melvnberd Feb 11 '14 at 22:18
This is just a test to see if you manage to delete all your cookies. you can run it anywhere console, the submit event – Endless Feb 11 '14 at 22:21
This isen't going to delete just that one cookie you wanna delete. just too see if it is possible – Endless Feb 11 '14 at 22:22
Your code did delete the cookies.. can you please customize so I can specifically delete a cookie please? thank you very much for the help! – melvnberd Feb 11 '14 at 22:34
actually did tried putting this code: `for (var it in $.cookie()) $.removeCookie(it);` on `document.ready` and it also worked! also deleted all cookies as well. my only problem here is that it wont work when im putting it on `submit function` – melvnberd Feb 11 '14 at 22:42

How to Remove a Cookie on Submit?

1 Answers1