Не могу выполнить изменение значения 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: 'Сервер не отвечает. Повторите попытку позже.',
                });        
            }
        });
    }
});

Ответы (0 шт):