Я пытаюсь создать модальное всплывающее окно и включить вызов AJAX внутри модального тела. Сценарий, включающий AJAX. работает отлично.Удалить подтверждение с использованием Bootstrap и AJAX
Вот кнопка, которая вызывает модальность (я работаю с шаблонами TWIG)
<button class="btn btn-danger" data-id="{{ product.id }}">Delete</button>
Это скрипт JQuery:
$(document).ready(function() {
$('[data-id]').each(function() {
var $this = $(this),
id = $this.data('id');
$this.on('click', function(event) {
event.preventDefault();
$.post('{{ path('dashboard_ajax ') }}', {
'id': id
},
function(details) {
var $modal = $(details);
$('#confirm-delete').remove();
$('body').append($modal);
$modal.modal();
}
);
})
});
});
И это страница с модальной
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">Confirm Delete</h4>
</div>
<div class="modal-body">
<div class="alert alert-danger" role="alert">
<p>Do you really want to delete <b>{{ product.name }}?</b></p>
</div>
<img src="{{ asset('uploads/product_images/') }}{{ product.image }}" style="width: 240px;" class="img-responsive thumbnail" />
</div>
<div class="modal-footer">
<button type="button" id="misha" class="btn btn-default" data-dismiss="modal">Cancel</button>
<a class="btn btn-danger btn-ok">Delete</a>
</div>
</div>
</div>
Теперь, если нажать на кнопку удаления, я бы хотел удалить выбранный элемент, используя связанную страницу (exa mple: delete.php)
Из-за этого вопроса я просто подумал о http://t4t5.github.io/sweeta lert/это тоже очень мило. Спасибо, что вспомнил меня. –