Сохранять значение selectbox после отправки

Question

На веб-сайте, который я сейчас делаю, я разместил selectbox, чтобы пользователь мог сортировать список элементов, отображаемых на странице. Когда они выбирают один, страница отправляется, а значение selectbox возвращается к первому по умолчанию. Теперь я хочу, чтобы selectbox сохранял значение после отправки.

Im работает в XSLT, поэтому я не могу использовать PHP. Есть ли функция Javascript для этого? или возможно плагин/функция jQuery?

Благодаря

моей формы:

<form name="sort-form" action="{$root}/resorts/" method="get"> 
    <select name="filter" onChange="document.getElementById('sort-form').submit();"> 
     <option value="">Sort By...</option> 
     <option value="recommended">Recommended</option> 
     <option value="location">Location</option> 
     <option value="prices-from">Low budget</option> 
     <option value="prices-till">High budget</option> 
    </select> 
</form> 

Answer 1

У вас есть два варианта:

1. Отправить форму с помощью AJAX.
2. Сохраните состояние в Cookies.

Я рекомендую использовать AJAX, поскольку он делает интерфейсы более интерактивными и экономит интернет-трафик. Чтобы отправить форму, вы можете использовать JQuery .post() метод:

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("#sort-form").submit(function(){ 
     $.post("/your/url.php", 
      $("#sort-form").serialize(), 
      function(data){ 
       // optional callback 
      } 
     ); 
    }); 
    }); 

Если это не вариант (например, страница должна быть перезагружена в любом случае), вы должны установить Cookies, а затем, после перезагрузки, проверьте их снова. Пример (с использованием функций от here):

// on submit 
setCookie("select_value", document.getElementById('yourSelectId').value); 
.... 
// on load 
var sortSelect = document.getElementById('yourSelectId'); 
var val = getCookie("select_value"); 
for(index = 0; index < sortSelect.length; index++) { 
if(sortSelect[index].value == val) 
    sortSelect.selectedIndex = index; 
}