title: How to set default dropdown value and selection based by localStorage data
body: <p>I have this form:</p>
  
  <pre><code>&lt;form id="suspendedProperties"&gt;
      &lt;p&gt;&lt;h4&gt;Select Station:
      &lt;select name="stationDropdown" id="stationDropdown" onChange="storeLocalContent('stationDropdown',this.value)" &gt;
          &lt;option value="50028000"&gt;Tanama River&lt;/option&gt;
          &lt;option value="50010500"&gt;Rio Guajataca, Lares&lt;/option&gt;
          &lt;option value="60008002"&gt;Example River2&lt;/option&gt;
          &lt;option value="60008003"&gt;Example River3&lt;/option&gt;
          &lt;option value="60008004"&gt;Example River4&lt;/option&gt;
       &lt;/select&gt;
       &lt;/h4&gt;&lt;/p&gt;
  
      &lt;p&gt;Select Sample Medium:
          &lt;select name="sampleMediumDropdown" id="sampleMediumDropdown"  onChange="storeLocalContent('sampleMediumDropdown',this.value)"&gt;
            &lt;option value="WS"&gt;WS(Surface Water)&lt;/option&gt;
            &lt;option value="WSQ"&gt;WSQ(Surface Water QC)&lt;/option&gt;
          &lt;/select&gt;
          &lt;/p&gt;
      &lt;p&gt;Begin Date
          &lt;input type="date" /&gt;
       &lt;/p&gt;
       &lt;p&gt;Hydrologic Event: &lt;select name="hydroEvent" id="hydroEvent" onChange="storeLocalContent('hydroEvent',this.value)" &gt;
                              &lt;option value="4"&gt;4- stable, low stage&lt;/option&gt;
                              &lt;option value="5"&gt;5- falling stage&lt;/option&gt;
                              &lt;option value="6"&gt;6- stable, high stage&lt;/option&gt;
                              &lt;option value="7"&gt;7- peakstage&lt;/option&gt;
                              &lt;option value="8"&gt;8- rising state&lt;/option&gt;
                              &lt;option value="9" selected&gt;9- stable, normal stage&lt;/option&gt;
                              &lt;option value="A"&gt;A- Not Determined&lt;/option&gt;
                              &lt;option value="X"&gt;X- Not applicable&lt;/option&gt;  
                            &lt;/select&gt;
  &lt;/p&gt;
  &lt;p&gt;Add:&lt;input type="number" size="" id="containerCuantity" onChange="storeLocalContent('containerCuantity',this.value)"/&gt; &lt;select id="singleMultiContainer"                             name="singleMultiContainer" onChange="storeLocalContent('singleMultiContainer',this.value)"&gt;
                                          &lt;option value="single"&gt;Single container sample&lt;/option&gt;
                                          &lt;option value="multi"&gt;Multiple sets container&lt;/option&gt;
                                         &lt;/select&gt;
  &lt;/p&gt;
   &lt;p&gt;Analyses Requested:(Applies to all samples)&lt;br/&gt;&lt;/p&gt;
   &lt;div id="analyses" &gt;
   &lt;table align="center" cellpadding="10px"&gt;
   &lt;tr&gt;
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="C"&gt; Concentration&lt;/input&gt;&lt;/td&gt;  
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="SF"&gt; Sand-fine break**&lt;/input&gt;&lt;/td&gt; 
   &lt;/tr&gt;
   &lt;tr&gt;
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="SA"&gt; Sand analysis**&lt;/input&gt;&lt;/td&gt;
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="T"&gt; Turbidity&lt;/input&gt;   &lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="LOI"&gt; Loss-on-ignition**&lt;/input&gt;&lt;/td&gt;
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="DS"&gt; Dissolve solids&lt;/input&gt;&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="SC"&gt; Specific conductance&lt;/input&gt;&lt;/td&gt;                                      
   &lt;td align="left"&gt;&lt;input type="checkbox" name="analysis" value="Z"&gt; Full-size fractions**&lt;/input&gt;&lt;/td&gt;
   &lt;/tr&gt;
   &lt;/table&gt;
   &lt;/div&gt;
  &lt;input type="button" value="Main Menu" onClick="window.location='SED_WE.html'"/&gt;
  &lt;input id="nextButton" type="button" value="Add Sample info." onDblClick="getLocalContent(C)"/&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>and I want to set up default selected options in the drop down value and in the other fields thier respective values. This is my JS:</p>
  
  <pre><code>     function initialize() {
                  // Test to see if we support the Storage API
                  var SupportsLocal = (('localStorage' in window) &amp;&amp; window['localStorage'] !== null);
                  var SupportsSession = (('sessionStorage' in window) &amp;&amp; window['sessionStorage'] !== null);
  
                  // if either one is not supported, then bail on the demo
                  if (!SupportsLocal || !SupportsSession) {
                      document.getElementById('infoform').innerHTML = "&lt;p&gt;Sorry, this browser does not support the W3C Storage API.&lt;/p&gt;";
                      return;
                  }
                  // if the localStorage object has some content, restore it
                  if (window.localStorage.length != 0) {
                      for(i=0;i&lt;window.localStorage.length;i++){
  
                                  getLocalContent(window.localStorage.key(i));
  
  
                      }
                  }
   }
   function storeLocalContent(elementId,value){
      window.localStorage.setItem(elementId,value);
  
   }
   function getLocalContent(elementId){
       document.getElementById(elementId).value = window.localStorage.getItem(elementId);
   }
  
   window.onload = function(){
       initialize();
   }
  </code></pre>
  
  <p>Is there any possible way to set the default values of the dropdowns to be the last value that the user chose?</p>