Keep values after page reload of javascript
<p>I know this is a topic where you can find tons of answers for... I spent now quite some time to search for the solution I am looking for.</p>

<p>I have a PHP file with a form. This PHP file uses a JavaScript for a drop down pre-selection.
Means: If a user selects a value in drop-down1 then there is a limited selection in drop-down2.
This JavaScript definitely needs to reload the PHP file for changing the values of the second drop-down2 list.</p>

<p>The question is now: How can I keep the entered values of the user in the form, after the JavaScript has been executed. Currently all entered data get lost.</p>

<p>One option would be to set all values into the URL and grab them with GET. Yes.. that would be an option but as I am using 13 values, the URL would look not too nice. I don't want to user to take notice of what happens.
I cant use the POST, as I don't push the posting button.. it's just the JavaScript that gets executed and reloads the page.</p>

<p>I thought about filling the Session with the entered data but that is not directly possible as JavaScript is on the client side and the session is on the server side.</p>

<p>Do you have any suggestions?</p>

<p>Form Example:
First Name (text box)   Last Name (text box)    Age (drop-down)        Sex (drop-down)</p>

<p>Province (JS drop down) District (JS drop down) Commune (JS drop down) Village (JS drop down)</p>

<p>Transf.from (drop down) Health Center (text box) Ambulance (drop-down) Self.transferred (drop down)    SEND BUTTON</p>

<p>dynmicoptionlist.js code:</p>

<pre><code>   //Set parameters for provinces selection
   function reload1(form) {

      var val1=form.provinces.options[form.provinces.options.selectedIndex].value;

      //Get the current URL
      var url1=window.location.href;

      //Check if the current URL has the search term in it (-1 means it is not in it)
      if(url1.search("&amp;provinces=") != -1) {

         //Now that the search term was found, cut the search term from the URL so that it can be replaced
         //This is necessary for multiple selections in the same drop down box
     var url2 = url1.substr(0,url1.search("&amp;provinces="));

         //If the user has selected "Please select", then dont add the provinces parameter
         if(val1 == "") {

        //Create the new URL
            self.location= url2
         }
         else {

            //Create the new URL
            self.location= url2 + "&amp;provinces=" + val1 ;
         }
      }
      else {

         //The search term was not found, so just add the provinces
         self.location= url1 + "&amp;provinces=" + val1;
      }
   }

   //Set parameters for districts selection
   function reload2(form) {

      var val1=form.provinces.options[form.provinces.options.selectedIndex].value; 
      var val2=form.districts.options[form.districts.options.selectedIndex].value; 

      //Get the current URL
      var url1=window.location.href;

      //Check if the current URL has the search term in it (-1 means it is not in it)
      if(url1.search("&amp;districts=") != -1) {

         //Now that the search term was found, cut the search term from the URL so that it can be replaced
         //This is necessary for multiple selections in the same drop down box
         var url2 = url1.substr(0,url1.search("&amp;districts="));

         //If the user has selected "Please select", then dont add the provinces parameter
         if(val2 == "") {

        //Create the new URL
            self.location= url2
         }
         else {

            //Create the new URL
            self.location= url2 + "&amp;districts=" + val2 ;
         }
      }
      else {

         //The search term was not found, so just add the districts
         self.location= url1 + "&amp;districts=" + val2;
      }
   }

   //Set parameters for communes selection
   function reload3(form) {

      var val1=form.provinces.options[form.provinces.options.selectedIndex].value; 
      var val2=form.districts.options[form.districts.options.selectedIndex].value; 
      var val3=form.communes.options[form.communes.options.selectedIndex].value; 

      //Get the current URL
      var url1=window.location.href;

      //Check if the current URL has the search term in it (-1 means it is not in it)
      if(url1.search("&amp;communes=") != -1) {

         //Now that the search term was found, cut the search term from the URL so that it can be replaced
         //This is necessary for multiple selections in the same drop down box
         var url2 = url1.substr(0,url1.search("&amp;communes="));

             //If the user has selected "Please select", then dont add the provinces parameter
         if(val3 == "") {

        //Create the new URL
            self.location= url2
         }
         else {

            //Create the new URL
            self.location= url2 + "&amp;communes=" + val3 ;
         }
      }
      else {

         //The search term was not found, so just add the communes
         self.location= url1 + "&amp;communes=" + val3;
      }
   }
</code></pre>

<hr>

<p>On behalf of JohnP's suggestion here are my changes so far:
I've added the onload function to fill the hidden field with a value:</p>

<pre><code>&lt;body onload=\"setValue()\"&gt;
</code></pre>

<p>The JavaScript filling the value looks like this:</p>

<pre><code>&lt;script type=\"text/javascript\"&gt;

   function setValue() {

      document.getElementById(\"dyndrpdwnhidden\").value=\"createPatient\";
   }
&lt;/script&gt;
</code></pre>

<p>In my form I've added the hidden field:</p>

<pre><code>&lt;input type=\"hidden\" id=\"dyndrpdwnhidden\"&gt;
</code></pre>

<p>To get the values out of the form's input fields in my JavaScript dynmicoptionlist.js above I've used as an example:</p>

<pre><code>var entry_date = form.entry_date.value;
</code></pre>
