title: How to use value of html select element to sort collection in Shopify liquid
body: <p>I have the following html select element:</p>
  
  <pre><code>&lt;div class="sort-collection-by"&gt;
  &lt;label for="sort-by"&gt;Sort by&lt;/label&gt; 
  &lt;select id="sort-by"&gt;
      &lt;option value="manual"&gt;Featured&lt;/option&gt;
      &lt;option value="price-ascending"&gt;Price: Low to High&lt;/option&gt;
      &lt;option value="price-descending"&gt;Price: High to Low&lt;/option&gt;
      &lt;option value="title-ascending"&gt;A-Z&lt;/option&gt;
      &lt;option value="title-descending"&gt;Z-A&lt;/option&gt;
      &lt;option value="created-ascending"&gt;Oldest to Newest&lt;/option&gt;
      &lt;option value="created-descending"&gt;Newest to Oldest&lt;/option&gt;
      &lt;option value="best-selling"&gt;Best Selling&lt;/option&gt;
  &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want to use the chosen option in the following liquid tag where I have indicated SELECT_CHOICE_HERE.</p>
  
  <pre><code>{% assign sorted_products = collection.products | sort: SELECT_CHOICE_HERE %}
  {% for product in sorted_products %}
  </code></pre>
  
  <p>I would like to have the sort action performed immediately when the select element value changes.</p>
  
  <p>Thanks for any help.</p>