Dynamicznie generowane elementy nie reagują na zdarzenia

0

Witam, mam na stronie tabelkę:

<div class="row">
    <div class="col-sm-12">
        <table class="table" id="tabela">
            <thead>
                <tr>
                    <th>Tytul</th>
                    <th>ilosc</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><input type="text" name="tytul" value="" class="form-control" /></td>
                    <td><input type="number" name="ilosc" value="1" min="1" class="form-control" /></td>
                    <td><button class="btn btn-danger deleteRecord"><span class="glyphicon glyphicon-minus"></span></button></td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

Button "Add" dodaje dynamicznie wiersz w tabeli taki sam jak ten który jest już wpisany na sztywno, wygląda to tak:

$("#addRecord").click(function () {

                var row = '<tr>'+
                                '<td><input type="text" name="tytul" value="" class="form-control" /></td>'+
                                '<td><input type="number" name="ilosc" value="1" min="1" class="form-control" /></td>'+
                               '<td><button class="btn btn-danger deleteRecord"><span class="glyphicon glyphicon-minus"></span></button></td>'+
                           '</tr>';

                $('#tabela').find('tbody').append(row);
            });

Tutaj wszystko działa. Jednak jak można zauważyć na końcu każdego wiersza generuje button który docelowo ma usuwać dany wiersz, póki co jednak nie chce w żadnej sposób reagować na wiersze generowane dynamicznie, jest to dziwne bo sama funkcja działa w przypadku gdy klikam button "deleteRecord" w wierszy wygenerowanym statycznie. Wygląda to tak:

$('.deleteRecord').on('click', null, function () { 
                alert('ALERT!!!!');
            });

Opcja z zdarzeniem .click() też nic więcej nie wnosi. Konsola w żadnym przypadku nie wyrzuca błędów. Może ktoś powiedzieć mi dlaczego tak się dzieje?

1
$('body').on('click', '.deleteRecord', function() {
        //tak bedzie dzialac dynamicznie
});
0

Działa, dziękuje

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0