Не могу выполнить изменение значения select/input внутри формы, подгруженной в модальное окно AJAX'ом
Всех приветствую!
Ситуация следующая. Есть модальное окно Magnific Popup, которое отвечает за изменение и сохранение характеристик различных изделий. Идея такая, что при клике на кнопку "редактировать" открывается модальное окно с select'ом, при изменении которого в это же окно подгружается форма с характеристикам изделия (у каждого изделия эти характеристики отличаются). Внизу формы есть кнопка сохранить и данные эти сохраняются в JSON'е в LocalStorage.
При повторном нажатии кнопки "редактировать" на уже измененном изделии данные из Local Storage должны подгружаться в модальное окно и открываться оно уже должно с измененным селектор, подгруженной формой и заполненными полями этой формы.
Так вот, селект у меня меняется, форма подгружается, а изменить select'ы и input'ы я не могу. Не получается.
Код вот такой:
$('#product-edit-popup').find('select.choose').val(JSON.parse(localStorage.getItem(currEdit)).cutName).trigger('change');
let currModalObj = JSON.parse(localStorage.getItem(currEdit));
delete currModalObj.cutName;
for (let key in currModalObj) {
if (key == 'material' || key == 'thickness' || key == 'cover' || key == 'color' || key == 'colorSide') {
let selectId = 'select.' + key,
currVal = currModalObj[key];
$('#product-edit-popup').find(selectId).val(currVal).trigger('change');
} else {
let inputId = 'input.' + key,
currVal = currModalObj[key];
$('#product-edit-popup').find(inputId).val(currVal);
}
}
Первая строчка - работает. Именно она изменяет селект, отвечающий за выбор изделия. После чего JSON парсится в объект, из него удаляется ненужная характеристика, нужная только для изменения селекта и свойства объекта (названные одинаково с классами select'ов/input'ов используются для их поиска. Однако, ничего не ищется и никакие значения не изменяются. Подскажите, пожалуйста, в чем может быть проблема использования таких селекторов?
Непонимание заключается в том, что в случае с самым первым селектом все работает, а с последующими - нет.
P.S. Вручную прописывать (как в первой строчке) нужные селекты тоже пробовал - тоже не работает.
P.P.S Вот код, который подгружает форму для изделия:
$('body').on('change', '.choose', function(){
if ($('option:selected',this).attr('value') != null) {
goodItem = $('option:selected',this).attr('value');
$.ajax({
type: "POST",
url: "includes/goods/" + goodItem + ".php",
cache: false,
success: function(html){
$('#product-form-wrapper').html(html);
$('select').select2({
placeholder: "Выберите значение из списка...",
width: "resolve",
language: "ru",
dropdownParent: $("#product-edit-popup")
});
$('#color').select2({
placeholder: "Выберите значение из списка...",
templateResult: formatState,
width: "resolve",
language: "ru",
dropdownParent: $("#product-edit-popup")
});
},
error: function(){
$('body').xmalert({
x: 'right',
y: 'top',
xOffset: 30,
yOffset: 30,
alertSpacing: 40,
lifetime: 6000,
fadeDelay: 0.3,
template: 'messageError',
title: 'Критическая ошибка!',
paragraph: 'Сервер не отвечает. Повторите попытку позже.',
});
}
});
}
});