Drop Down Menu To Remember Selection And Redirect User

I am making a landing page with a drop down menu which will redirect users to a new directory. http://steerbox.com/countryselect/ That part is working and now I need to add code

Solution 1:

I agree with yckart's comment and suggest using localStorage.

The support is pretty good (shown here) and unless you need to support IE7 or less you should be ok.

You can set and retrive data like this:

localStorage.varName = 'bling';
var myVal = localStorage.varName;
// or:localStorage['a little more flexibility'] = 'bling';

To use this, you could do the following:

<scripttype="text/javascript">if (localStorage && localStorage.country) {
        location = localStorage.country;    
    }

    functionformChanged(form) {
        var val = form.options[form.selectedIndex].value;
        if (val !== 'non-value') {
          if (localStorage) {
            localStorage.country = val;
          }
          location = val;
        }
    }
</script><FORMNAME="form1"><selectonchange="formChanged(this);"NAME="country"SIZE="1"><OPTIONVALUE="non-value">Select Country
    <OPTIONVALUE="chile">Chile
    <OPTIONVALUE="colombia">Colombia
    <OPTIONVALUE="bolivia">Bolivia
  </select></FORM>

http://jsfiddle.net/K4Jkc/

An approach that would be a little more conservative would be to compare the value stored in localStorage (if there is one) to options in the select-list before doing the redirect, as shown in this jsFiddle:

http://jsfiddle.net/K4Jkc/1/