通过Javascript操作传递变量

Question

If anyone can help with this, it would be greatly appreciated!

I have an HTML form, with a drop down for the state you're in.

Then I have a JavaScript function that determines the state picked, and redirects the user accordingly.

  function pickstate()
{
        if(document.drop_list.State.value == "AR" ){
            document.drop_list.action = "www.theurl.com";
            document.drop_list.submit();
        }
}

My question is: can I use this method (and if so, how) to pass the state to the next form, so that when the user is redirected, the dropdown says the state they picked.

I know how to do this using PHP and POST, but this is not posting, it's just a redirect to the correct URL based on the state, and since 20 or so states will use the same form, I don't want to make the user select their state again.

The reason I'm using this method is not everyone will be redirected — many states will stay on the form that is first displayed.. This is why I can't use POST.

Help! Thank you.

Answer 1

You can add a hash to the URL

function pickstate()
{
    var stateVal = document.drop_list.State.value;
    switch(stateVal) {
      case "AR"
        document.drop_list.action = "www.theurl.com/#"+stateVal;
      break;
      case "IT"
        document.drop_list.action = "www.theurl.com/#"+stateVal;
      break;
    }

    document.drop_list.submit();
}

Then the next form can select the state by using the passed hash

window.location.hash; // eg. will be equal to #AR or #IT

Answer 2

You could store the value in local storage.

function pickState() {
    if (document.drop_list.State.value == "AR") {
        document.drop_list.action = "www.theurl.com";
        localStorage.setItem('selectedState', 'AR');
        document.drop_list.submit();
    }
}

Then add another functions that sets the value.

function setState() {
    var storedSelectedState = localStorage.getItem('selectedState');

    if (storedSelectedState) {
        document.drop_list.State.value = storedSelectedState;
    }
}