Показать сообщение отдельно
  #1 (permalink)  
Старый 02.02.2021, 08:30
Интересующийся
Отправить личное сообщение для Wimko Посмотреть профиль Найти все сообщения от Wimko
 
Регистрация: 05.10.2019
Сообщений: 13

Не работает событие клика на динамически созданный элемент
Всем привет, учусь, хочу сделать динамическую форму, сделал кнопку которая добавляет новый Form-group, внутри каждого form-group есть еще коллекция input-ов, как мне осуществить добавление в эту коллекцию, в созданном form-group?
$('#btn_add').click(function(){
      let currentFields = $('#block_test .alert').length;
        currentFields++;
            $('#block_insert').append(' <div class="alert alert-success mt-4" role="alert">\                                       
                                                <div class="form-group">\
                                                    <p class="mt-3" style="font-weight:bold;">Блок № '+currentFields+'</p>\
                                                    <div id="block_group_'+currentFields+'">\
                                                        <div id="group_1" class="input-group mb-2">\
                                                            <div class="input-group-prepend">\
                                                                <div class="input-group-text"><b>1</b></div>\
                                                            </div>\
                                                            <input type="text" name="value_'+currentFields+'[]" class="form-control " id="v'+currentFields+'" required>\
                                                        </div>\
                                                        <div id="group_2" class="input-group mb-2">\
                                                            <div class="input-group-prepend">\
                                                                <div class="input-group-text"><b>2</b></div>\
                                                            </div>\
                                                            <input type="text" name="value_'+currentFields+'[]" class="form-control" id="v'+currentFields+'" >\
                                                        </div>\
                                                       
                                                    </div>\
                                                    <div>\
                                                        <button id="add_'+currentFields+'" type="button" class="btn btn-success mt-2 mb-2">Добавить новое поле</button>\
                                                        <button id="rem_'+currentFields+'" type="button" class="btn btn-danger mt-2 mb-2">Удалить</button>\
                                                    </div>\
                                                </div>\
                                            </div>');
                                                    return false;
                                            });


А потом я пытаюсь сделать вот такое

$('#add_2').click(function(){
            let currentFields = $('#block_group_2 input').length;
        currentFields++;
            $('#block_group_2').append('<div id="group_'+currentFields+'" class="input-group mb-2"><div class="input-group-prepend"><div class="input-group-text"><b>'+currentFields+'</b></div> </div> <input type="text" name="value_1[]" class="form-control " id="v1_'+currentFields+'"> </div>');



            return false;
    });


Не работает... Я не так что-то делаю, напомню, что второе обращение применяется к динамически добавленному блоку (из 1 скрипта), если открыть "Просмотр страницы" этого блока нет. Если добавить все блоки без динамического добавления (Статически) второй скрипт работает... Подскажите в чем тут проблема?
Ответить с цитированием