On a product list page of our store, we have (customer-facing) the ability to allow someone to select their Sort By in a dropdown box, one of the options being "A to Z." Due to some constraints on our backend, we have no way of "forcing" the page to sort "A to Z," instead only sorting on "Most Popular" and a few other options.

The issue is that we do want this particular page to sort A to Z by default, and we want it to do so in a way that doesn't interfere with the guest. So, the script would have to trigger before the page loads, select the A to Z sort from that drop down box, and then fire the page reload (or reload the page as soon as possible, so a customer doesn't see the page "double load" or anything). Make sense?

I have no idea how to start with this javascript, but one solution is to hide the content of the page via CSS, then fire the dosort using some kind of script, but there may be something way more elegant than that...

Here's the code for the dropdown:

<div class="sortProductsMain">
<label id="sortById" class="sortProductsHeader">Sort By: </label>
<select id="sortSelection" dojoattachevent="onchange: doSort">
<option id="sortProductsDefault" class="sortProductsDefault" value="sortProductsDefault">Most Popular</option>
<option id="sortProductsHighestRated" class="sortProductsHighestRated" value="sortProductsHighestRated">Highest Rated</option>
<option id="sortProductsNewest" class="sortProductsNewest" value="sortProductsNewest">Newest</option>
<option id="sortProductsAToZ" class="sortProductsAToZ" value="sortProductsAToZ">A-Z</option>
<option id="sortProductsZToA" class="sortProductsZToA" value="sortProductsZToA">Z-A</option>
<option id="sortProductsPriceHighToLow" class="sortProductsPriceHighToLow" value="sortProductsPriceHighToLow">$$$-$</option>
<option id="sortProductsPriceLowToHigh" class="sortProductsPriceLowToHigh" value="sortProductsPriceLowToHigh">$-$$$</option>