Вот так выглядит мой селектор по умолчанию:
Вот так при выборе какого-либо option:
Я сделал так, чтобы при перезагрузке страницы запоминался бы выбранный option, но в итоге выводится только сам option без форм внутри него:
Вот скрипты, думаю где-то здесь может быть ошибка:
<!-- Save selector -->
<script>
$(document).ready(function() {
var $select = $('#productType');
function handleSelectValue() {
var selectedClass = $select.find(':selected').data('class');
localStorage.setItem("selected", selectedClass);
}
var cookie = localStorage.getItem("selected");
if (cookie) {
$select.find('[data-class="' + cookie + '"]').attr('selected', 'selected');
}
handleSelectValue();
$select.on('change', handleSelectValue);
});
</script>
<!-- Option's hide/show -->
<script>
$('#productType').change(function(){
if($('#productType option:selected').filter('#dvdDisc').length) {
$("#dvdSizes").show();
$("#bookSizes").hide();
$("#furnitureSizes").hide();
}
else if($('#productType option:selected').filter('#book').length) {
$("#dvdSizes").hide();
$("#bookSizes").show();
$("#furnitureSizes").hide();
}
else if($('#productType option:selected').filter('#furniture').length) {
$("#dvdSizes").hide();
$("#bookSizes").hide();
$("#furnitureSizes").show();
}
else {
$("#dvdSizes").hide();
$("#bookSizes").hide();
$("#furnitureSizes").hide();
}
});
</script>
Буду благодарен за ответ.