diff --git a/assets/js/app.js b/assets/js/app.js
index 6c792ed339..9e30338e9b 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -30,6 +30,7 @@ class App {
this.#createAutoCompleteFields();
this.#createBatchActions();
this.#createModalWindowsForDeleteActions();
+ this.#createModalWindowsForConfirmationActions();
this.#createPopovers();
this.#createTooltips();
@@ -396,6 +397,15 @@ class App {
});
}
+ #createModalWindowsForConfirmationActions() {
+ const modalTitles = document.querySelectorAll('.action-confirmation-title');
+ modalTitles.forEach((modalTitle) => {
+ const titleContentWithPlaceholders = modalTitle.textContent;
+ const actionName = modalTitle.getAttribute('data-action-title');
+ modalTitle.textContent = titleContentWithPlaceholders.replace('%action_name%', actionName);
+ });
+ }
+
#createPopovers() {
document.querySelectorAll('[data-bs-toggle="popover"]').forEach((popoverElement) => {
new bootstrap.Popover(popoverElement);
diff --git a/src/Config/Action.php b/src/Config/Action.php
index 1b1116fd44..50cda78575 100644
--- a/src/Config/Action.php
+++ b/src/Config/Action.php
@@ -123,6 +123,13 @@ public function setIcon(?string $icon): self
return $this;
}
+ public function setConfirmationModal(string $modalText): self
+ {
+ $this->dto->setConfirmationModal($modalText);
+
+ return $this;
+ }
+
/**
* Use this to override the default CSS classes applied to actions and use instead your own CSS classes.
* See also addCssClass() to add your own custom classes without removing the default ones.
diff --git a/src/Dto/ActionDto.php b/src/Dto/ActionDto.php
index 78344dbb36..dc4b1f115e 100644
--- a/src/Dto/ActionDto.php
+++ b/src/Dto/ActionDto.php
@@ -39,6 +39,7 @@ final class ActionDto
private ButtonType $butonType = ButtonType::Submit;
private ButtonVariant $variant = ButtonVariant::Default;
private ButtonStyle $style = ButtonStyle::Solid;
+ private ?string $modalText = null;
public function getType(): string
{
@@ -357,6 +358,21 @@ public function usesTextStyle(): bool
return ButtonStyle::Text === $this->style;
}
+ public function hasConfirmationModal(): bool
+ {
+ return isset($this->modalText);
+ }
+
+ public function setConfirmationModal(string $modalText): void
+ {
+ $this->modalText = $modalText;
+ }
+
+ public function getModalText(): ?string
+ {
+ return $this->modalText;
+ }
+
/**
* @internal
*/
diff --git a/src/Factory/ActionFactory.php b/src/Factory/ActionFactory.php
index f258a321ad..798ad3ea3e 100644
--- a/src/Factory/ActionFactory.php
+++ b/src/Factory/ActionFactory.php
@@ -195,6 +195,13 @@ private function processAction(string $pageName, ActionDto $actionDto, ?EntityDt
}
}
+ if ($actionDto->hasConfirmationModal()) {
+ $actionDto->addHtmlAttributes([
+ 'data-bs-toggle' => 'modal',
+ 'data-bs-target' => '#modal-confirmation-'.$actionDto->getName(),
+ ]);
+ }
+
if (Action::DELETE === $actionDto->getName()) {
$actionDto->addHtmlAttributes([
'formaction' => $this->adminUrlGenerator->setController($adminContext->getCrud()->getControllerFqcn())->setAction(Action::DELETE)->setEntityId($entityDto->getPrimaryKeyValue())->generateUrl(),
diff --git a/templates/crud/action.html.twig b/templates/crud/action.html.twig
index f5ddb82c24..bbd7541696 100644
--- a/templates/crud/action.html.twig
+++ b/templates/crud/action.html.twig
@@ -10,8 +10,8 @@
htmlElement="{{ action.htmlElement }}"
type="{{ action.buttonType.value }}"
icon="{{ action.icon }}"
- href="{{ action.htmlElement.isLink ? action.linkUrl : null }}"
- action="{{ action.htmlElement.isForm ? action.linkUrl : null }}"
+ href="{{ action.hasConfirmationModal == false and action.htmlElement.isLink ? action.linkUrl : null }}"
+ action="{{ action.hasConfirmationModal == false and action.htmlElement.isForm ? action.linkUrl : null }}"
method="{{ action.htmlElement.isForm ? 'POST' : null }}"
>
{%- if outerScope.action.label is not empty -%}{{ outerScope.action.label|trans|raw }}{%- endif -%}
diff --git a/templates/crud/action_group.html.twig b/templates/crud/action_group.html.twig
index 5068a17a57..60df22cfe3 100644
--- a/templates/crud/action_group.html.twig
+++ b/templates/crud/action_group.html.twig
@@ -55,7 +55,7 @@
label="{{ item.label }}" icon="{{ item.icon }}" class="{{ item.cssClass }} dropdown-item-variant-{{ item.variant.value }}"
htmlAttributes="{{ item.htmlAttributes }}"
renderAsForm="{{ item.isRenderedAsForm }}"
- url="{{ item.linkUrl }}" renderLabelRaw="true"
+ url="{{ item.hasConfirmationModal == false ? item.linkUrl : null }}" renderLabelRaw="true"
showBlankIcons="{{ group.hasAnyActionWithIcon }}"
/>
{% endif %}
diff --git a/templates/crud/detail.html.twig b/templates/crud/detail.html.twig
index d2633ceef5..82f41b3681 100644
--- a/templates/crud/detail.html.twig
+++ b/templates/crud/detail.html.twig
@@ -65,6 +65,18 @@
{% block delete_form %}
{{ include('@EasyAdmin/crud/includes/_delete_form.html.twig', {entity_id: entity.primaryKeyValue}, with_context: false) }}
{% endblock delete_form %}
+
+ {% for action in entity.actions %}
+ {% if action.isActionGroup %}
+ {% for item in action.items %}
+ {% if item.hasConfirmationModal %}
+ {{ include('@EasyAdmin/crud/includes/_confirm_action_modal.html.twig', {action: item}, with_context: false) }}
+ {% endif %}
+ {% endfor %}
+ {% elseif action.hasConfirmationModal %}
+ {{ include('@EasyAdmin/crud/includes/_confirm_action_modal.html.twig', {action: action}, with_context: false) }}
+ {% endif %}
+ {% endfor %}
{% endblock %}
{% macro render_field_contents(entity, field) %}
diff --git a/templates/crud/edit.html.twig b/templates/crud/edit.html.twig
index af9e7b495c..50023a9ac7 100644
--- a/templates/crud/edit.html.twig
+++ b/templates/crud/edit.html.twig
@@ -67,4 +67,16 @@
{% block delete_form %}
{{ include('@EasyAdmin/crud/includes/_delete_form.html.twig', {entity_id: entity.primaryKeyValue}, with_context: false) }}
{% endblock delete_form %}
+
+ {% for action in entity.actions %}
+ {% if action.isActionGroup %}
+ {% for item in action.items %}
+ {% if item.hasConfirmationModal %}
+ {{ include('@EasyAdmin/crud/includes/_confirm_action_modal.html.twig', {action: item}, with_context: false) }}
+ {% endif %}
+ {% endfor %}
+ {% elseif action.hasConfirmationModal %}
+ {{ include('@EasyAdmin/crud/includes/_confirm_action_modal.html.twig', {action: action}, with_context: false) }}
+ {% endif %}
+ {% endfor %}
{% endblock %}
diff --git a/templates/crud/includes/_confirm_action_modal.html.twig b/templates/crud/includes/_confirm_action_modal.html.twig
new file mode 100644
index 0000000000..dad664ff86
--- /dev/null
+++ b/templates/crud/includes/_confirm_action_modal.html.twig
@@ -0,0 +1,24 @@
+
+
+
+
+
{{ 'confirmation_modal.title'|trans(domain: 'EasyAdminBundle') }}
+
{{ action.modalText }}
+
+
+
+
+