alex_lemurski
@alex_lemurski

Как отображать поля в зависимости от выбранного значения из Select?

Вопрос состоит не столько в том как отображать те или иные поля по Select, а как сделать так чтобы после обновления страницы (F5) или после ее сохранения (отправки формы на сервер) и снова заходя на эту страницу отображаемое поле по Select не исчезало?

66bddcc389f9d103826694.png

оба варианта скрипта работают нормально, но не обеспечивают отображение выбранных полей на странице
  • Вопрос задан
  • 129 просмотров
Пригласить эксперта
Ответы на вопрос 1
Нужно сохранять в localstorage выбор селекта, примерный код:

function showField(option) {
// Скрыть все поля
document.querySelectorAll('.conditional-field').forEach(field => field.style.display = 'none');

// Показать поле, соответствующее выбранной опции
if (option) {
const field = document.getElementById(`${option}Field`);
if (field) {
field.style.display = 'block';
}
}
}

// Инициализация состояния выбора при загрузке страницы
document.addEventListener('DOMContentLoaded', () => {
const selectField = document.getElementById('selectField');

// Загрузить сохраненное значение из localStorage
const savedOption = localStorage.getItem('selectedOption');
if (savedOption) {
selectField.value = savedOption;
showField(savedOption);
}

selectField.addEventListener('change', (event) => {
const value = event.target.value;
showField(value);

// Сохранить выбранное значение в localStorage
localStorage.setItem('selectedOption', value);
});
});
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы