Now that you have placed the generated HTML, just make sure you include the jQuery output inside the loop that generates your TD elements. It should go beyond this loop, preferably at the bottom of the page!
If you look at HTML, you will see this 3 times:
<script type="text/javascript"> $(document).ready(function () { $('.deleteRow').click(function (event) { event.preventDefault(); event.stopPropagation(); if (confirm('Delete?')) { var $t = $(this); $.post($(this).attr('href'), function (data) { if (data) { $t.parent().parent().remove(); } }); } return false; }); }); </script>
Now you could say, “Yes, that was three times, but shouldn't it be executed once? In the end, I update the click handler!” Oh no. The jQuery.click () method associates a function with a specific event, adding this function to the eventListeners list for this event. Since event binding works in general in Javascript. Linking means adding it to the list.
If you want to make sure that the click handler you add is ONLY the click handler for the element, you will need to use unbind first:
$('.deleteRow').unbind('click').click(function (event) {
instead of this:
$('.deleteRow').click(function (event) {