Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Regular Coder tpeck's Avatar
    Join Date
    Oct 2002
    Location
    Sydney, Australia
    Posts
    816
    Thanks
    43
    Thanked 6 Times in 5 Posts

    global variables using jstorage

    I am trying out a javascript storage system called jstorage. It is like cookies but without the restrictions. I can insert a value and resurrect it later with:

    Code:
    insert_value();
    get_value();
    I am now using it in a script to store the fields of inputs and instantly update them in the page. It works!

    Code:
    window.onload = function()
    {
    	var theInputs = document.getElementsByTagName('input');
    	for(var i = 0; i < theInputs.length; i++)
    	{
    		if(theInputs[i].type == 'text')
    		{
    			theInputs[i].onkeyup = function()
    			{
    				validate();insert_value(this.name,this.value);
    			}
    		}
    		get_value('done');
    		if(value != null)
    		{
    			theInputs[i].value = value;
    		}
    	}
    }
    
    function insert_value(key, val){
    $.jStorage.set(key, val);
    var key = "",val = "";
    }
    
    function get_value(key){
    var value = $.jStorage.get(key);
    var key = "";
    }
    But what I want to do is a bit more complicated. It has to do with global variables, I think.

    I want to get the value of a previously stored item and use it with the value of the item displayed in the code above e.g:

    Code:
    get_value('something') + get_value('done')...
    
    i.e. fred + y
    ...and then save this combined value using the jstorage insert_value() function to be retrieved later.

    The question is not a jstorage issue (as far as I can see), but a way to use the retrieved get_values in the windows onload function.

    Everything I try doesn't let me use the values retrieved which become undefined or null when I try to combine them.

    Can anyone see what I am doing wrong? Here is the entire page:

    Code:
    <html>
    
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>Test</title>
    <script src="js/json2.js"></script>
    <script src="js/jstorage.min.js"></script>
    <script>
    window.onload = function()
    {
    	var theInputs = document.getElementsByTagName('input');
    	for(var i = 0; i < theInputs.length; i++)
    	{
    		if(theInputs[i].type == 'text')
    		{
    			theInputs[i].onkeyup = function()
    			{
    				validate();insert_value(this.name,this.value);
    			}
    		}
    		get_value('done');
    		if(value != null)
    		{
    			theInputs[i].value = value;
    		}
    	}
    }
    
    function insert_value(key, val){
    $.jStorage.set(key, val);
    //alert(key);alert(val);
    var key = "",val = "";
    }
    
    function get_value(key){
    var value = $.jStorage.get(key);
    alert(value);
    var key = "";
    }
    
    get_value('lesson');
    get_value('done');
    
    </script>
    </head>
    
    <body>
    
    <table border="0" cellpadding="0" cellspacing="0">
    	<tr>
    		<td>
    		<table class="write" border="0" style="border-collapse: collapse" cellpadding="3">
    			<tr>
    				<td>
    				<input type="text" id="done" name="done" size="2" maxlength="1" value="N"></td>
    			</tr>
    		</table>
    		</td>
    	</tr>
    </table>
    
    </body>
    
    </html>
    The difference between genius and stupidity is that genius has its limits. (Albert Einstein)

  • #2
    New to the CF scene
    Join Date
    Jan 2013
    Location
    http://www.blueorchidshotel.com
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you have whole javascript ???

  • #3
    Regular Coder tpeck's Avatar
    Join Date
    Oct 2002
    Location
    Sydney, Australia
    Posts
    816
    Thanks
    43
    Thanked 6 Times in 5 Posts
    You mean the packages? You can get them from here:

    https://github.com/douglascrockford/...aster/json2.js

    and here:

    https://github.com/andris9/jStorage

    I haven't included my failed tries.
    The difference between genius and stupidity is that genius has its limits. (Albert Einstein)

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,277
    Thanks
    10
    Thanked 581 Times in 562 Posts
    since localStorage works in IE8, that is a WHOLE lot of code just to support IE7. imho, K.I.S.S.

    i also see a lot of deprecated APIs in jStorage's source code, and everything comes back as a string instead of a rich type. yuck.

    if you are addung two numbers, you'll have to call "Number(a)+Number(b)" instead of just "a+b", that might be your issue here, but it wouldn't explain why one was undefined.

    the "this.name,this.value" is likely wrong: this refers to window in an onload event.

    you probably want something like:
    Code:
    insert_value( theInputs[i].name, theInputs[i].value);

    edit:

    here is a an IE6 compatible storage routine that uses strong types and MUCH less code than jStorage:

    Code:
    var store = (function() {
    	if (!location.protocol.match("data") && !window.localStorage) {
    		window.localStorage = {};
    	} //end webkit+ie8  patch
    
    	if (window.localStorage && !location.protocol.match("data")) {
    		function store(key, val) {
    			if (val) {
    				localStorage[document.domain][key] = val;
    			} else {
    				try {
    					var tm = localStorage[document.domain][key];
    					if (tm) {
    						tm = tm.toString();
    					}
    				} catch (rr) {
    					return "";
    				}
    				return tm;
    			}
    			return;
    		}
    	} else {
    		var store = function(key, val) {
    			if (val) {
    				setCookie(key, val);
    			} else {
    				return getCookie(key);
    			}
    		}
    	}
    
    	function iestorer() {
    		var D = document;
    		if (!D.createStyleSheet || window.localStorage) {
    			return;
    		}
    		var tCSS = D.createStyleSheet();
    		tCSS.addRule(".userData", "behavior:url(#default#userdata)", 0);
    		var Static = D.createElement("input");
    		var Q = function(z, x) {
    			Static.setAttribute(z, x);
    		};
    		Q("type", "hidden");
    		Q("id", "EzStatic4");
    		Q("className", "userData");
    		document.getElementsByTagName("head")[0].appendChild(Static);
    		var s = document.getElementById("EzStatic420");
    
    		function ies(k, v) {
    			if (!v) {
    				s.load("oXMLStore");
    				var t = s.getAttribute(k);
    				return unescape(t) || "";
    			} else {
    				s.setAttribute(k, escape(String(v)));
    				s.save("oXMLStore");
    			}
    		}
    		window.store = ies;
    	}
    	iestorer();
    	return store;
    }()));
    use it like store(key) to get and store(key,value) to set; simple.

    if you want to support old non-ie browers (why), you'll need to provide your own ubiquitous setCookie and getCookie functions...
    Last edited by rnd me; 01-24-2013 at 02:22 AM.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • Users who have thanked rnd me for this post:

    tpeck (01-24-2013)

  • #5
    Regular Coder tpeck's Avatar
    Join Date
    Oct 2002
    Location
    Sydney, Australia
    Posts
    816
    Thanks
    43
    Thanked 6 Times in 5 Posts
    Thanks rnd me. I am starting to think that my approach is wrong. I have to know first what storage system to use. But it all looks a bit insecure.

    I'll ask about storage systems elsewhere.

    I think this js issue is (partly) solved by using the variables outside of the function(s).
    The difference between genius and stupidity is that genius has its limits. (Albert Einstein)

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,032
    Thanks
    75
    Thanked 4,325 Times in 4,291 Posts
    See my comments in your thread in the MySQL forum.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,593
    Thanks
    0
    Thanked 645 Times in 635 Posts
    There is no reason any more for having global variables at all in JavaScript - except for one per shared library/framework.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,032
    Thanks
    75
    Thanked 4,325 Times in 4,291 Posts
    Read the whole thread and the one in the MySQL forum, Felgall. He isn't really talking about JS global variables, at all. He just wants persistent storage of user input.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Regular Coder tpeck's Avatar
    Join Date
    Oct 2002
    Location
    Sydney, Australia
    Posts
    816
    Thanks
    43
    Thanked 6 Times in 5 Posts
    Just to finish off, using rnd me's example, this will work:

    Code:
    window.onload = function(){
    
    // *****from rnd me ************************************
    var store = (function() {
    	if (!location.protocol.match("data") && !window.localStorage) {
    		window.localStorage = {};
    	} //end webkit+ie8  patch
    
    	if (window.localStorage && !location.protocol.match("data")) {
    		function store(key, val) {
    			if (val) {
    				localStorage[document.domain][key] = val;
    			} else {
    				try {
    					var tm = localStorage[document.domain][key];
    					if (tm) {
    						tm = tm.toString();
    					}
    				} catch (rr) {
    					return "";
    				}
    				return tm;
    			}
    			return;
    		}
    	} else {
    		var store = function(key, val) {
    			if (val) {
    				setCookie(key, val);
    			} else {
    				return getCookie(key);
    			}
    		}
    	}
    	
    // *****************************************
    
    var x = store('lesson'); // get 'lesson' key
    //alert(x);
    var theInputs = document.getElementsByTagName('input');
    
    	if(theInputs == null)
    	{
     	store('done', 'n');theInputs[i].value = 'n'; //alert("mmm");
        }
    	for(var i = 0; i < theInputs.length; i++)
    	{
    		if(theInputs[i].type == 'text')
    		{
    			theInputs[i].onkeyup = function()
    			{
    				validate();store('done',value);
    				store(x,value);
    				var y = store(x);
    				alert('The value of the key \'lesson1\' is '+y);
    			}
    		}
    		theInputs[i].value = value;
    	}
    }
    
    function validate() {
    var val = document.getElementById('done').value;
    if (/[^yYnN]/.test(val)) {
    alert ('Please enter Y or N');
    document.getElementById('done').value = "";
    return;
    }
    }
    Last edited by tpeck; 01-25-2013 at 07:48 AM.
    The difference between genius and stupidity is that genius has its limits. (Albert Einstein)

  • #10
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,593
    Thanks
    0
    Thanked 645 Times in 635 Posts
    Quote Originally Posted by Old Pedant View Post
    Read the whole thread and the one in the MySQL forum, Felgall. He isn't really talking about JS global variables, at all. He just wants persistent storage of user input.
    So the thread title is wrong and needs to be fixed since it is asking about global variables. The current title makes it look like the OP doesn't even know what global variables are.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •