重定向URL以进行产品分类

时间:2015-06-29 21:46:51

标签: javascript jquery

我正在尝试将我的产品列表分类为名称或价格,我有一个javascript函数和一个选择/选项代码来做它,但我希望它是按钮而不是下拉列表。

<!-- A script to pick up the change event on the drop-down list below and redirect to the option selected's value. -->
<script type="text/javascript">
    $(document).on('change', 'select[data-sort-redirect]', function(){
    path = window.location.pathname + '?' + $(this).val(),
    baseUrl = window.location.protocol + '//' + window.location.host;
    window.location = baseUrl + path;
    });
</script>
<!-- A drop-down list with hard-coded values.  -->
<select data-sort-redirect>
    <option id="1" value="orderBy=base_price&order=asc"{% if sortField == 'base_price' and sortOrder == 'asc'  %} selected="selected"{% endif %}>Price - Ascending</option>
    <option id="2" value="orderBy=base_price&order=desc"{% if sortField == 'base_price' and sortOrder == 'desc'  %} selected="selected"{% endif %}>Price - Descending</option>
    <option id="3" value="orderBy=name&order=asc"{% if sortField == 'name' and sortOrder == 'asc'  %} selected="selected"{% endif %}>Name - Ascending</option>
    <option id="4" value="orderBy=name&order=desc"{% if sortField == 'name' and sortOrder == 'desc'  %} selected="selected"{% endif %}>Name - Descending</option>
    <option id="5" value="orderBy=sku&order=asc"{% if sortField == 'sku' and sortOrder == 'asc'  %} selected="selected"{% endif %}>SKU - Ascending</option>
    <option id="6" value="orderBy=sku&order=desc"{% if sortField == 'sku' and sortOrder == 'desc'  %} selected="selected"{% endif %}>SKU - Descending</option>
    <option id="7" value="orderBy=created_at&order=asc"{% if sortField == 'created_at' and sortOrder == 'asc'  %} selected="selected"{% endif %}>Date Created - Ascending</option>
    <option id="8" value="orderBy=base_price&order=desc"{% if sortField == 'created_at' and sortOrder == 'desc'  %} selected="selected"{% endif %}>Date Created - Descending</option>
</select>

这段代码可以这样做吗?

0 个答案:

没有答案