Почему не срабатывает jQuery в yii2?

Question

[Лев К]

Всем привет!
написал на jQuery событие для кнопки, созданной yii2 таким образом :

echo Html::button('+', ['id' => 'btn_add', 'class' => 'btn btn-primary']);

$js1 = "
    
    $('#btn_add').on('click', function () {
        $.ajax({
            type: 'POST',
            dataType: 'json',
            success: function(data) { 
               //здесь выполняются какие то действия, все хорошо работает
                $('#btn_add').replaceWith('<button type=\"button\" id=\"btn_remove\" class=\"btn btn-primary\">-</button>'); //кнопка тоже заменяется
            },
        });
        
    });

    $('#btn_remove').on('click', function () {
        alert('1'); //а вот это уже не срабатывает
        $('#btn_remove').replaceWith('<button type=\"button\" id=\"btn_add\" class=\"btn btn-primary\">+</button>');
    });
";
$this->registerJs($js1);

Не знаете в чем может быть проблема?

Answer 1

[Лев К]

Сделал 2 кнопки сразу на форме и одну скрыл в событие ready, далее просто скрывал показывал кнопки

Answer 2

[Игорь Воронов]

Так в DOM`е-то есть btn_remove?
btn_add вы добавили. И сделали это до инициализации события, а btn_remove где? Проверьте, что раньше происходит: формирование элемента, на которое вешается событие или js отрабатывает.
Ну или делегируйте по id от элемента, который точно есть в DOM.

Comments

[Лев К]

Игорь Воронов btn_remove создается только в success
Как тогда лучше сделать не подскажете ?

[Игорь Воронов]

Лев К: делегируйте событие.
Например, от условного div`а с id=page (который должен точно быть в ДОМе до выполения скрипта):
$('#page').delegate('btn_remove', 'click', function() {
//тело вашей ф-ции
});

[Игорь Воронов]

Лев К:
$('#page').delegate('#btn_remove', 'click', function() {
//тело вашей ф-ции
});

Забыл id :)