How to pass values to multiple select dropdow via url hash

Question

I'm trying to pass values for three different select dropdowns through url hash. So if I enter, ' http://mywebsite.com/page#value1AppleThursday ' if would pass the same value to their respective select dropdown. Is that possible?

Thanks!

Here is my HTML:

<ul class="filters">
  <li>
      <select id="type-select" class="input-select">
          <option value="value1">Option 1</option>
          <option value="value2">Option 2</option>
          <option value="value3">Option 3</option>
      </select>
  </li>
  <li>
      <select id="duration-select" class="input-select">
          <option value="apple">Apple</option>
          <option value="orange">Orange</option>
          <option value="grape">Grape</option>
          <option value="banana">Banana/option>
      </select>
  </li>
  <li>
      <select id="sc-select" class="input-select">
        <option value="monday">Monday</option>
        <option value="tuesday">Tuesday</option>
        <option value="wednesday">Wednesday</option>
        <option value="thursday">Thursday</option>
        <option value="friday">Friday</option>
      </select>
  </li>
</ul>

Answer 1

You can achieve that by capitalize the first letter of each parameter (' http://mywebsite.com/page#Value1AppleThursday ):

        $(document).ready(function(){
            var urlHashValue = decodeURIComponent(window.location.hash.substring(1));
            var urlVariables = urlHashValue.match(/[A-Z][a-z|0-9]+/g);
            if(urlVariables.length >= 3){
                $("#type-select").val(urlVariables[0].toLowerCase());
                $("#duration-select").val(urlVariables[1].toLowerCase());
                $("#sc-select").val(urlVariables[2].toLowerCase());
            }
        });

Or you can use a separator "|" to separate the three parameters (' http://mywebsite.com/page#value1|Apple|Thursday ) or any other symbol you like:

$(document).ready(function(){
            var urlHashValue = decodeURIComponent(window.location.hash.substring(1));
            var urlVariables = urlHashValue.split('|');
            if(urlVariables.length >= 3){
                $("#type-select").val(urlVariables[0].toLowerCase());
                $("#duration-select").val(urlVariables[1].toLowerCase());
                $("#sc-select").val(urlVariables[2].toLowerCase());
            }
        });