Блог

Здесь немного сложный, не уверен, возможно ли это.

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

Код эффективно скрывает параметры в «layout_select» в зависимости от опции, выбранной в «column_select». Однако, если я выберу

3 столбца макет 4

При нажатии кнопки сохранения страница перезагружается, и выбранный параметр снова становится макетом 3. То же самое произойдет, если я выберу

3 столбца макет 5 или 2 столбца макет 2

Мне нужно, чтобы jQuery сохранял правильную выбранную опцию при обновлении.

Это то, что у меня есть до сих пор:

 <select name="column_select" id="column_select">
    <option value="col1">1 column</option>
    <option value="col2">2 column</option>
    <option value="col3">3 column</option>
</select>

<select name="layout_select" id="layout_select">
    <!--Below shows when '1 column' is selected is hidden otherwise-->
    <option value="col1">none</option>

    <!--Below shows when '2 column' is selected is hidden otherwise-->
    <option value="col2_ms">layout 1</option> 
    <option value="col2_sm">layout 2</option>

    <!--Below shows when '3 column' is selected is hidden otherwise-->
    <option value="col3_mss">layout 3</option>
    <option value="col3_ssm">layout 4</option>
    <option value="col3_sms">layout 5</option>
</select>
  

jQuery:

 $(document).ready(function() {
    var optarray = $("#layout_select").children('option').map(function() {
        return {
            "value": this.value,
            "option": "<option value='"   this.value   "'>"   this.text   "</option>"
        }
    })

    $("#column_select").change(function() {
        $("#layout_select").children('option').remove();
        var addoptarr = [];
        for (i = 0; i < optarray.length; i  ) {
            if (optarray[i].value.indexOf($(this).val()) > -1) {
                addoptarr.push(optarray[i].option);
            }
        }
        $("#layout_select").html(addoptarr.join(''))
    }).change();
})
  

Демонстрация — http://jsfiddle.net/N7Xpb/1 /

Я озадачен javascript, поэтому буду признателен за любую помощь.

Мое предложение состояло бы в том, чтобы сохранить выбранные значения (после изменения параметра выбора) внутри файла cookie с помощью плагина cookie jQuery.

Затем в вашем $ (document) .ready (), вы можете установить каждый из параметров выбора из этих сохраненных значений.