• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
The Electric Toolbox Blog

The Electric Toolbox Blog

Linux, Apache, Nginx, MySQL, Javascript and PHP articles

  • Applications
  • FCKEditor
  • Apache
  • Windows
  • Contact Us
Home / Setting cookies with jQuery

Setting cookies with jQuery

Setting and clearing cookies with jQuery is really easy (especially when compared with regular Javascript) but it’s not included in the jQuery core and requires a plug-in. This post shows how to set, get the value of and clear cookies with jQuery.

The plugin

Download the jQuery cookie plugin here: https://github.com/carhartl/jquery-cookie
Note that I am not the author of this plugin.

There is an updated version that does not require jQuery, which is available here: https://github.com/js-cookie/js-cookie The syntax is different from that described in this post, although the Github page includes code to allow for backward compatibility.

Set a cookie

Setting a cookie with jQuery is as simple as this, where a cookie is created called "example" with a value of "foo":

$.cookie("example", "foo");

This is a session cookie which is set for the current path level and will be destroyed when the user exits the browser. To make the same cookie last for e.g. 7 days do this:

$.cookie("example", "foo", { expires: 7 });

Note: the above examples will apply the cookie to the current path level.

If the page requested is http://www.example.com/file.html then it will be set for the / path and will be available for all paths at the domain. If the page is http://www.example.com/subpath/file.html then it will be set for the /subpath level and will not be accessible at / (or /otherpath etc).

To explicitly make the cookie available for all paths on your domain, make sure the path is set:

$.cookie("example", "foo", { path: '/' });

To limit it to a specific path instead:

$.cookie("example", "foo", { path: '/admin' });

Get the cookie’s value

Getting the cookie’s value is also very easy with jQuery. The following would show the value of the "example" cookie in a dialog window:

alert( $.cookie("example") );

Delete the cookie

And finally, to delete a cookie set the value to null. Setting it to e.g. an empty string doesn’t remove it; it just clears the value.

$.cookie("example", null);

Looping through the cookies

My next Javascript post looks at how to loop through cookies with Javascript to show all the currently set cookies.

Cookies and domains

Refer to my "Cookies and Domains" post for more information about being able to set the domain of a cookie and how it relates to subdomains.

Cookies and paths

I touched on the issue with cookies and setting the path in the post above. As of the last update of this post (November 5th 2010), I am intending to write another post shortly which covers this topic in more detail.

Check Out These Related posts:

  1. Selectively delete cookies in Firefox
  2. Get a MySQL table structure from the INFORMATION_SCHEMA
  3. Demos for getting and setting form values with jQuery
  4. jQuery Facebox: setting the width

Filed Under: Javascript

Primary Sidebar

Categories

  • Apache
  • Applications
  • Article
  • Case Studies
  • Email Servers
  • FCKEditor
  • HTML And CSS
  • Javascript
  • Linux/Unix/BSD
  • Microsoft SQL Server
  • Miscellaneous Postings
  • MySql
  • Networking
  • Nginx Web Server
  • Offsite Articles
  • OSX
  • PHP
  • Quick Tips
  • RFC – Request for Comments
  • SilverStripe
  • VMWare
  • VPN
  • Windows
  • WordPress

Recent Posts

  • Vim Show Line Numbers
  • Add User To Group Linux
  • Chmod 777 Tutorial
  • How to Copy Directory Linux
  • Linux create user

Copyright © 2021. ElectricToolBox. All Rights Reserved.

  • Contact Us
  • Copyright Info
  • Privacy Policy
  • Sitemap