CODEWITHSUNDEEP
javascriptjquerydrupal-7
subhojit777
subhojit777

Reputation: 596

how to retain javascript variables even if I reload or redirected to any other page

I have created an image slider. This slider appears on every page of my website. There's a click event associated with every image in image slider. On clicking any image there are variables which stores data associated with that image(say artist name, etc. and these fields are hidden).

On clicking any image the page is redirected to another page, say artists page. In artists page the stored data are displayed. The image slider is also present in artists page.

Now, the problem is when I come to artists page the variables are not displayed, because the js file in reloaded once again and all data are lost. Javascript file for both the pages are same. Infact, all pages in my website shall use the same js file. But, being in artists page if I click any image then the data are displayed. I want that the data must be retained and displayed even if it gets redirected to artists page.

I have tried ready() event, but no help. How to do it?

P.S. The website is created using Drupal 7

Upvotes: 1

Views: 753

Answers (3)

badunk
badunk

Reputation: 4350

There are many ways to achieve this, however, one of the easier ways in your situation may be to simply re-retrieve the data. How is the first page able to retrieve the variables? Are you using Drupal's templating engine to pass them to client? Does it fetch the original javascript data through AJAX?

If the former is true, you may need to modify the template render hooks in Drupal to fetch the data the same way as the first page and pass them into your new page.

If the latter is true, just rerequest the data using jQuery's onReady as you mentioned. You may still need to use a Drupal module to expose the data as a webservice for your jQuery to fetch, or you could just write your own php page/drupal module to grab the data from the database manually with drupal's database abstraction.

Upvotes: 0

dty
dty

Reputation: 18998

You can't directly. The Javascript state is is cleared on every page load.

Choices are:

  1. Instead of doing a full page reload, see if you can do something AJAX-y to replace the content
  2. Use session cookies to keep the state
  3. Use HTML 5 Local Storage if the browser supports it

Upvotes: 0

Joseph
Joseph

Reputation: 119847

i assume your data is not processed in the server side. JavaScript variable data does NOT persist for every page visit. it's always a fresh start for each page.

you should use cookies for this one. jQuery also has cookies plugin, but i haven't tried that yet (try asking Google). Another method is to use HTML 5 Web storage but note that it is HTML5, pretty new feature.

basically what you want done is:

  1. click item
  2. store data in cookie
  3. go to next page
  4. read the data in cookie
  5. display

Upvotes: 1

Related Questions