Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 188
  • Last Modified:

Why do I love all of my javascript changes once a form is submitted on my webpage?

My webpage below has a changeable background color, but once the form is submitted or once the page is reloaded, it goes back to the default color. Is there a simple way to prevent that in javascript?

my webpage
0
shampouya
Asked:
shampouya
  • 2
  • 2
1 Solution
 
HonorGodCommented:
I presume that when you say "love", you mean "save" ;-)
0
 
StingRaYCommented:
You may save your background color into cookie and load them when the page is loaded.
0
 
shampouyaAuthor Commented:
Sorry I meant to say why do I lose all my javascript changes. Is there any way to keep the changes once the form on my page is submitted? Does the form being submitted count as a reload of the page?
0
 
StingRaYCommented:
For example:

Add these functions to your script:

function saveTheme(theme)
{
    setCookie('theme', theme);
}

function loadTheme()
{
    theme = getCookie('theme');
    if (theme == 'purple') { purpleTheme(); }
    else { if (theme == 'blue') { blueTheme(); }
    else { if (theme == 'red') { redTheme(); } }
    }
}

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}

Open in new window


and have some mods to your html

<li><img src="purpleSquare.jpg" onClick="purpleTheme();saveTheme('purple');" id="purpleSquare"></li>
<li><img src="blueSquare.jpg" onClick="blueTheme();saveTheme('blue');" id="blueSquare"></li>
<li><img src="redSquare.jpg" onClick="redTheme();saveTheme('red');" id="redSquare"></li>

Open in new window


and also put this to your script file
$(function(){
    loadTheme();
});

Open in new window

0
 
shampouyaAuthor Commented:
thanks
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now