添加选定的属性jQuery

Question

I want to add the selected attribute to my select option HTML, I'm using an option value which has a link the window location href.

<select name="sort">
    <option value="">Sort</option>
    <option value="category.php?c=electronic&sort=pricelow">Price Low</option>
    <option value="category.php?c=electronic&sort=pricehigh">Price High</option>
    <option value="categori.php?c=electronic&sort=popular">Popular</option>
</select>

$("select[name=sort]").change(function() {
    window.location.href = $(this).val();

    $(this).children().attr("selected","selected");
});

When I change the selected option to Price Low , it refreshes the page and sorts by lowest price, but the option's value will not sorted properly.

What am I doing wrong?

Answer 1

When you reload the page, you can not run another action. It is like erasing the whiteboard.

Selecting of the element would need to occur on the load of the page. You would beed to look at the url and match it to the select element. Ideally the serverside code would select it.

$(function(){  //on document ready
    $("select[name=sort] option")  //get the options
        .filter( function () { //find the one that has the value that matches the url
             return window.location.href.indexOf(this.value)>-1; //return true if it is a match       
        })
        .prop("selected",true);  //select it
});