[RESOLVED]Unable to get updated cookie value in jquery after ajax call

I have made a simple cart example in mvc. what I’m doing is , after clicking on Add to cart span , I’m calling a Controller Action method.

And then updating the cookie value with Total no of item in cart. but it give me initial value of cookie.

This is my Ajax Code to call Controller Action

$(document).delegate('.addCart','click', function () {
            var getId = parseInt($(this).attr('id').slice(3));
            $.ajax({
                type: 'GET',
                contentType: 'application/json; charset=utf-8',
                url: '/Comments/CartDetailsSetGet',
                data: { Id: getId },
                success: function (data) {
                    var count = parseInt(data);
                    if (isNaN(count)){
                        alert(data);
                    }else{
                        var getCookies=  @HttpContext.Current.Request.Cookies["CartCookie"].Value;
                        $('.cartNum').html(getCookies);
                    }
                },
                error: function (data) {
                    alert("Error In Adding Item To Cart");
                }
            });
        });

There is span > with class cartNum in which I’m showing Total no of item in cart .

addCart is span on which I’m Clicking to Add Item In Cart.

This is my Action Method , which is My default Action

GuestbookContext db = new GuestbookContext(); // my DbContxt Class
        HttpCookie ck = new HttpCookie("CartCookie");
        public ActionResult Index()
        {
            if (Request.Cookies["CartCookie"] == null)
            {
                ck.Value = "0";
                Response.SetCookie(ck);
            }
            IList<Comment> commentList = db.Comments.ToList();
            return View(commentList);
        }

This Action Which is getting called On Ajax Request.

static List<int?> CartItemsId = new List<int?>();
        public string CartDetailsSetGet(int? Id)
        {
              if (CartItemsId.Contains(Id) != true)
                {
                    CartItemsId.Add(Id);
                    int getCount = CartItemsId.Count();
                    System.Web.HttpContext.Current.Request.Cookies["CartCookie"].Value = getCount.ToString();
                    ck.Expires = DateTime.Now.AddDays(-1);
                    var d = "";
                    if (System.Web.HttpContext.Current.Request.Cookies["CartCookie"] != null)
                    {
                        d = System.Web.HttpContext.Current.Request.Cookies["CartCookie"].Value;
                    }
                    return d.ToString();
                }
                else
                {
                    return "This Item Is Already In Cart";
                }
            
        }

Here in d I’m getting updated cookie value but in Ajax Success , this line giving me Initial value, i.e 0.

var getCookies=  @HttpContext.Current.Request.Cookies["CartCookie"].Value;

Your razor code is server-side code, it isn’t running inside the browser.  View the source of your page and you’ll see

success: function (data) {
                    var count = parseInt(data);
                    if (isNaN(count)){
                        alert(data);
                    }else{
                        var getCookies=  0;
                        $('.cartNum').html(getCookies);
                    }
                },

so no matter what happens, getCookies is always going to be 0.  You need to read the data from the document.cookie object

http://www.w3schools.com/js/js_cookies.asp

or return the data as part of your ajax method (either as well as, or instead of the cookie)

return View(new {Comments: commentList, Quantity: ck.Value);

then amend your success code to reflect this change

Leave a Reply