Session handling using jquery

January 20, 2019
by Inaam Hussain
  • jquerySession

In this tutorial, we will learn how to handle sessions using jquery.

For handling sessions here we will be using sessionStorage object. sessionStorage is similar to localStorage, except that it stores the data for only one session. The data is deleted when the user closes the browser window.

We will be using the JquerySession plugin which will make our task much simpler and easy to manage.

View demohere
Download Codehere
Download Jquery Session pluginhere

In demo you can see that how to add, remove, get session variable with it’s description.

Before using plugin functionality please include “Jquery” & “JquerySession”(Here) plugin in main index file.

So, let’s start with JquerySession plugin functionality

Add session variable

Syntax : $.session.set(‘some key’, ‘a value’);

Description : Using “set” we can easily add value to session.

Example : $.session.set(‘Name’,’Inaam’) : “Name” -> Key & “Inaam” -> Value


Clear session variable

Syntax : $.session.remove(‘some key’);

Description : Using “remove” we can remove particular session variable.

Example : $.session.remove(‘Name’) : “Name” -> Key


Fetch session variable

Syntax : $.session.get(‘some key’);

Description : Using “get” we can fetch particular session variable.

Example : $.session.get(‘Name’) : “Name” -> Key


Remove all session variable

Syntax : $.session.clear();

Description : Using “clear” we can clear full/all session data.

Example : $.session.clear()

These are the commands we can use for handling session using Jquery & Jquery Session plugin.



This was a basic tutorial to give you an understanding of how sessions can be managed using Jquery.


Engineer. Blogger. I like to be updated on new upcoming emerging technologies.

Get notified on our new articles

Subscribe to get the latest on Node.js, Angular, Blockchain and more. We never spam!
First Name:


  1. |

    Sorry Mr. can I set session as array value?

    • |

      Yes you can Faud hasan,
      For example : $.session.set(‘address’, [‘jog’,’400102′]);
      This will add value in array to key address.
      And in output you will get comma separated values : (i.e: jog,400102).

      • |

        Oke thanks, i will try it 🙂 (y)

      • |

        not working in:
        onclick=’$.session.set(“keycol”, [“TINGKAT”]);alert($.session.get(keycol));’
        onclick=’$.session.set(“keycol”, [“TINGKAT”]);alert($.session.get(keycol[0]));’

        • |

          Actually in get function you have not added key in double quotes.
          So for set & get like as follows,
          SET : $.session.set(“keycol”, [“TINGKAT”]);
          GET : $.session.get(“keycol”);

  2. ashish

    hi there..
    i set the session through jquery using this plugin..
    now i want to retrive it using PHP… but i am unable to do so…
    if i retrive using .get method of this plugin.. it shows the value…but not in PHP’s $_SESSION

    • |

      Hi Ashish,
      You can use one at a time either by using jquery or PHP’s session. if you are using PHP then you should go for PHP Session.

  3. |

    Hussain ji its giving me undefined error

    • |

      Hi Chandan,
      Where exactly you getting undefined error?

  4. nagaraj

    session removed if i close and open browser, how can i solve this?

  5. Hitesh

    Hey, i m implementing token based authentication, though i have token in my headers for specific users and i also want to handle my session with that token key how do i do that ??? thanks …

  6. |

    Hi Hitesh,
    If you are using jquery, then you have store that token in localstorage. and based on that you have to perform further operations. and every request you have to check response which is coming from backend. and if its not logged in send back to login page and clear the localStorage.

  7. Jesus Sánchez

    Hi Inaam,
    It was an awesome article, however, I was wondering if is there any way to do the same thing but between different js files, for example in A.js I set a variable with session as you say ($.session.set(‘variable’,’value’)) and in B.js I get the value of variable ($.session.get(‘variable’)). Just like SESSION in PHP but with js and jquery. The thing is that I’m not using PHP so that I’m looking for alternatives. If could help me, it could be great!

    • |

      yes you can access that variable in another page as well. However it store values in browser storage, so that its easily accessible.

      • |

        Hi Inaam,

        I have used the same jQuery session library. But I am unable to get jQuery Session variables on other page. On same page it is working perfectly when I try to access on other page it gives me undefined value.

        Please help me and if you already tried jQuery session on other pages.

        Thanks in Advance.

        • |

          Hi Kumar,
          sessionStorage gets cleared when the page session ends. A page session lasts for as long as the browser is open and survives over page reloads and restores. Opening a page in a new tab or window will cause a new session to be initiated.
          In this scenario you have to use localStorage.

  8. Akhil Agrahari

    Hi Inaam ,

    This is awesome plugin but its not working in another page.Please give me solution ASAP


    • |

      For that, you need to go for localStorage. which you can access through multiple tabs.

  9. |

    i have set the Session but cont able to Retrieve In another page ASPX please send some Ideas

  10. Hanamant

    Hey i am setting list in session in servlet and sending to jsp .but i want to iterate using jquery can u help..

    • Inaam Hussain

      In this tutorial just explained how we can use sessionStorage in browsers.
      Can you please elaborate what exactly u need to iterate?

  11. |

    thanks for your Info.

  12. |

    Thank you for this wonderfull plugin. awesome work by developer. hatsoff thalaivaa……

  13. |

    Can I remove a specific id key line in a session array with remove?

  14. |

    How can I check if a session is available on page load.

Leave a Comment