Как правильно сделать callback-функцию на jQuery?

Question

[Test Test]

Здравствуйте! В общем есть проблема, а именно с вызовом callback-функции.

Допустим есть форма, где есть возможность управлять контентом.

Функция добавления (работает отлично, к ней вопросов нету) - проверка данных, вывод новой записи на сайте (с помощью tmpl habrahabr.ru/post/112843)

А вот функции редактирования и удаления записей не работает именно для тех записей, которые были выведены прямо в браузере. Если страницу обновить, то всё работает.

Как вызываются callback'и

// Удаление
$("a[data-mod='delete']").on("click", function (e) {
});

//Обновление данных
$("input[data-mod='update']").change(function() {
})

Как выводится HTML

<? if($list) { ?>
															<? foreach($list AS $row) {  ?>
																<tr data-id="<?=$row->id;?>">
																	<td><a href="javascript:void(0);" data-mod="delete" class="btn btn-default"><i class="glyphicon glyphicon-remove"></i></a></td>
																	<td>
																		<input type="text" class="form-control" data-mod="update" data-field="min_price" value="<?=$row->min_price;?>"/>
																	</td>
																	<td>
																		<input type="text" class="form-control" data-mod="update" data-field="max_price" value="<?=$row->max_price;?>"/>
																		
																	</td>
																	<td>
																		<input type="text" class="form-control" data-mod="update" data-field="allowance" value="<?=$row->allowance;?>"/>
																		
																	</td>
																	<td class="result-div"></td>
																</tr>
															<? } ?>
														<? } ?>

<!--Шаблон для парсинга-->
<script id="trBodyTemplate" type="text/x-jquery-tmpl">
        <tr data-id="${id}">
			<td><a href="javascript:void(0);" data-mod="delete" class="btn btn-default"><i class="glyphicon glyphicon-remove"></i></a></td>
			<td>
				<input type="text" class="form-control" data-mod="update" data-field="min_price" value="${min_price}"/>
			</td>
			<td>
				<input type="text" class="form-control" data-mod="update" data-field="max_price" value="${max_price}"/>
				
			</td>
			<td>
				<input type="text" class="form-control" data-mod="update" data-field="allowance" value="${allowance}"/>
				
			</td>
			<td class="result-div"></td>
		</tr>
</script>

Спасибо!

Answer 1

[Alexander Sydorenko]

Попробуйте

// Удаление
$(document).on("click", "a[data-mod='delete']", function (e) {
});

//Обновление данных
$(document).on("change", "input[data-mod='update']", function() {
})

Comments

[Test Test]

Спасибо вам Большое! Помогло!