6

I am trying to make an application in phonegap. I have made a custom.js javascript file which have some functions as

function func1(){....}
function func2(){....}

All these functions will be used in two different html pages. In first HTML page,I am using a variable in func1 which is doing some operation. In second page, I want to access it in func2 in the state in which he was in func1. But i am unable to do it. I am including custom.js in both html pages. I have read that javascript files get reset/refresh when used in multiple pages. Can anybody give me an example that how to save the state of variable in func1 and then access that variable in func2 (in different HTML page) in the state in which he was in func1. i have also read about view state. but it is not working either for me. Please help...

Shahid Iqbal
  • 2,059
  • 2
  • 21
  • 29

3 Answers3

11

Store the values in localstorage and reference it from there.

function first() {
    localStorage.setItem('myItem', "something you want to store");
}

function second() {
    myValue = null;
    if (localStorage.getItem('myItem')) {
        myValue = localStorage.getItem('myItem');
    }
}
epascarello
  • 204,599
  • 20
  • 195
  • 236
  • 4
    I'd do `var val = localStorage.getItem(...);`, and then `if (val) { ...`, so that `getItem` is only invoked once... there's no need to retrieve the same item two times here. – Šime Vidas Oct 15 '12 at 12:38
  • 1
    Whoops, I meant to check for the key there, not the getItem. Morning coffee did not kick in. – epascarello Oct 15 '12 at 12:55
  • @epascarello Sorry .i got another problem. its working only for primitive JavaScript types and arrays but i want to store a custom object.To be specific i am using [Gap Socket](https://github.com/purplecabbage/phonegap-plugins/tree/master/iPhone/GapSocket) plugin to communicate with server. To connect to server, i write var mySocket = new GapSocket(hostOrIP, port); now when server gets connected, i want to store its state through mySocket variable so that i can use its other methods in other html pages(i.e send data) once it is connected. i tried your answer, its storing but not sending data. – Shahid Iqbal Oct 15 '12 at 15:02
  • @epascarello [This Link](http://stackoverflow.com/questions/2010892/storing-objects-in-html5-localstorage) is also saying exactly the same thing, but its JSON.Strigify soultion does not look suitable for my problem. – Shahid Iqbal Oct 15 '12 at 15:06
  • 1
    If the page is being refreshed, there is no way you can maintain that info. – epascarello Oct 15 '12 at 15:29
1

in modern browsers you can use localStorage for that

var get = function (key) {
  return window.localStorage ? window.localStorage[key] : null;
}

var put = function (key, value) {
  if (window.localStorage) {
    window.localStorage[key] = value;
  }
}

use get and put to store value to the local storage of most modern browsers..

lrsjng
  • 2,615
  • 1
  • 19
  • 23
0

The easier and preferred method would be to use window.localStorage for storing site wide variables. To accommodate older browsers as well, you can maybe consider having cookies as a secondary storage location.

// credits to http://mathiasbynens.be/notes/localstorage-pattern
var hasStorage = (function() {
      try {
        localStorage.setItem(mod, mod);
        localStorage.removeItem(mod);
        return true;
      } catch(e) {
        return false;
      }
    }());

function setSiteWideValue(_key, _value) {
    if(hasStorage) {
        localStorage[_key] = _value;
    }
    else {
        document.cookie = _key+'='+_value+'; expires=<date-here>; path=/; ;domain=<.yourdomain>';
    }
}

function getSiteWideValue(_key) {
    if(hasStorage) {
        return localStorage[_key];
    }
    else {
        if(document.cookie.indexOf(_key+'=') != -1) {
            return document.cookie.split(_key+'=')[1].split(';')[0];
        }
    }
}
techfoobar
  • 65,616
  • 14
  • 114
  • 135