jquery - dynamically-generated inputs not working -
i'm trying make dynamic table using jquery , html. is, text of input appends new row text n 1 cell , remove button in cell. problem click event of input not firing. here scripts of adding , removing rows
//remove row $('.remove-row').click(function () { alert('works!'); }); //add row $('.add-other-sources').click(function () { var $text=$(this).parent().parent().find('.other-sources-input'); var $table=$(this).parent().parent().parent().find('.other-sources-table') $('<tr><td>'+$text.val()+'</td><td><input type="button" class="remove-row" value="x"/></td></tr>').fadein('slow').appendto($table); $text.val(""); });
from figure out on web inspector, tag of input showing <input type="button" class="remove-row" value="x">
. has fact remove row event not working?
does have idea how fix this? in advance
you need delegated event handler:
//remove row $('table').on("click", ".remove-row", function () { alert('works!'); });
the reason normal handler attached existing elements. delegated handler click attached parent element, function executed if source bubbled selector specified.
Comments
Post a Comment