All Javascript JQuery
Inaam  

Session handling using jquery

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

Using JquerySession plugin 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.

 

21 thoughts on “Session handling using jquery

  1. Fuad Hasan

    Sorry Mr. can I set session as array value?

    1. Inaam Hussain

      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).
      Thanks.

      1. Fuad Hasan

        Oke thanks, i will try it 🙂 (y)

      2. Fuad Hasan

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

        1. Inaam Hussain

          Hi,
          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”);
          Thanks.

    2. ddemi77

      I like it

      1. Inaam Hussain

        Thanks for stopping by!!

  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

    1. Inaam Hussain

      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.
      Thanks.

  3. Chandan

    Hussain ji its giving me undefined error

    1. Inaam Hussain

      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. Inaam Hussain

    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.
    Thanks.

  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!
    Thanks.

    1. Inaam Hussain

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

      1. Kumar Roshan

        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.

        1. Inaam Hussain

          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.
          Thanks.

  8. Akhil Agrahari

    Hi Inaam ,

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

    Thanks

    1. Inaam Hussain

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

  9. vinishkhan

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

Leave A Comment