У меня есть несколько кнопок, которые в настоящее время перенаправляют на разные страницы, чтобы пользователи могли выполнить одно действие, и им затем нужно было бы нажать другую кнопку на странице подтверждения, чтобы вернуться на прежнее место. Это старая школа и неудобно …
То, что я хотел бы сделать, это создать 1 одиночное всплывающее окно, которое будет срабатывать (появляться) при нажатии любой из этих кнопок. Внутри коробки я хочу, чтобы появился соответствующий файл .php, чтобы пользователи могли подтвердить свои действия, а затем страница перезагрузилась бы и отобразила подтверждающее сообщение.
Пример:
Кнопка «Удалить» должна вызвать всплывающее окно подтверждения-popup.php с включенным в него файлом delete.php, чтобы пользователи могли подтвердить удаление.
Кнопка «Отмена» должна инициировать появление файла-подтверждения-popup.php с включенным в него файлом cancel.php, чтобы пользователи могли подтвердить отмену.
Вот что я сделал:
— Создал всплывающее окно и включил его на странице своего аккаунта (там находятся все кнопки).
— Добавлен JS, который проходит через идентификатор кнопки, чтобы вызвать всплывающее окно
При нажатии любой из кнопок всплывающее окно будет отображаться нормально.
Я застрял на этапе, когда различные «action» .php файлы должны быть переданы и включены в тело всплывающего окна. Я знаю, что мог бы создать несколько всплывающих окон для каждого соответствующего действия, но мы все знаем, что это не лучшая практика, и она удваивается.
Любая помощь будет оценена!
Редактировать: Добавлен код после комментария ниже
HTML:
<a href="<?php bloginfo('siteurl') ?>/?a_action=delete_auction&pid=<?php the_ID(); ?>"><button class="button-small button-red" id="confirm-delete">Delete</button></a>
JS:
$(document).ready(function() {
$("#confirm-delete").click(function() {
if (!$(".confirm-popup").is(":visible")) {
$(".confirm-popup").fadeIn("slow");
return false;
}
});
});
PHP verify_popup.php:
<div class="confirm-popup">
<?php include 'delete_auction.php'; ?>
</div>
Вы можете открывать различные фреймы во всплывающем окне в зависимости от нажатой кнопки. Это позволит вам использовать одно всплывающее окно, и вы просто отредактируете атрибут iframe src на правильной странице php. Например, вы можете добавить атрибут HTML для каждой кнопки, который содержит URL-адрес страницы, которая должна быть открыта кнопкой. Затем у вас будет некоторый JS-код, который при нажатии кнопки прочитает атрибут, содержащий URL-адрес, и поместит его в атрибут iframe src внутри всплывающего окна.
Примерно так с помощью jQuery:
<button class="myclass" cotent-url="delete.php">Delete</button>
<button class="myclass" cotent-url="save.php">Save</button>
<div class="popup"><iframe src=""></iframe></div>
<script type="text/javascript">
$('.myclass').click(function(){
$('.popup iframe').attr('src', $(this).attr('content-url'));
})
</script>
Или AJAX способом:
<button class="myclass" cotent-url="delete.php">Delete</button>
<button class="myclass" cotent-url="save.php">Save</button>
<div class="popup"></div>
<script type="text/javascript">
$('.myclass').click(function(){
$.ajax({
url: $(this).attr('content-url'),
data: {},
success: function(response) {
$('.popup').html(response);
},
dataType: 'html'
});
})
</script>
Других решений пока нет …