Updates for the new form-based actions

assets/css/easyadmin-theme/base.css

@@ -575,7 +575,7 @@ a.user-menu-wrapper .user-details:hover {
 }
 .content-header .page-actions:empty { display: none; }
 
-.content-header .page-actions :is(.btn,form:has(.btn)) + :is(.btn,form:has(.btn)) {
+.content-header .page-actions :is(.btn, form:has(.btn)) + :is(.btn, form:has(.btn)) {
     margin-inline-start: 10px;
 }
 

doc/actions.rst

@@ -344,10 +344,6 @@ Then you can configure the basic HTML/CSS attributes of the button/element
 that will represent the action::
 
     $viewInvoice = Action::new('viewInvoice', 'Invoice', 'fa fa-file-invoice')
-        // renders the action as a <a> HTML element
-        ->displayAsLink()
-        // renders the action as a <button> HTML element
-        ->displayAsButton()
         // a key-value array of attributes to add to the HTML element
         ->setHtmlAttributes(['data-foo' => 'bar', 'target' => '_blank'])
         // removes all existing CSS classes of the action and sets
@@ -357,13 +353,40 @@ that will represent the action::
         // useful when customizing a built-in action, which already has CSS classes)
         ->addCssClass('some-custom-css-class text-danger')
 
+By default, actions are rendered as ``<a>`` elements that make a ``GET`` request
+to the corresponding URL.
+
+    $viewInvoice = Action::new('viewInvoice', 'Invoice', 'fa fa-file-invoice')
+        // ...
+        // (default) renders the action as a <a> HTML element
+        ->displayAsLink()
+
+        // renders the action as a <button> HTML element; this is ignored in the
+        // index page, where entity actions are displayeds as <a> elements;
+        // this button sumits the edit/new form which is being rendered
+        ->displayAsButton()
+
+        // renders the action as a <button> element inside a <form> element different
+        // from the edit/new form being rendered; this is useful to call custom
+        // actions using the POST method
+        ->displayAsForm()
+    ;
+
+.. versionadded:: 4.25
+
+    The ``displayAsForm()`` method was introduced in EasyAdmin 4.25.0.
+
 .. note::
 
     When using ``setCssClass()`` or ``addCssClass()`` methods, the action loses
     the default CSS classes applied by EasyAdmin (``.btn`` and
     ``.action-<the-action-name>``). You might want to add those CSS classes
     manually to make your actions look as expected.
 
+.. tip::
+
+    Custom actions are
+
 Once you've configured the basics, use one of the following methods to define
 which method is executed when clicking on the action:
 

public/entrypoints.json

@@ -2,7 +2,7 @@
   "entrypoints": {
     "app": {
       "css": [
-        "/app.62f32d02.css"
+        "/app.842ae134.css"
       ],
       "js": [
         "/app.1ecd6d7a.js"

public/manifest.json

@@ -1,5 +1,5 @@
 {
-  "app.css": "app.62f32d02.css",
+  "app.css": "app.842ae134.css",
   "app.js": "app.1ecd6d7a.js",
   "form.js": "form.bcec6c2a.js",
   "page-layout.js": "page-layout.3347892e.js",

templates/components/ActionMenu/ActionList/Item.html.twig

@@ -1,4 +1,5 @@
 {% props
+    type = 'a', # possible values: 'a', 'form'
     label = null,
     renderLabelRaw = false,
     icon = null,
@@ -7,8 +8,19 @@
 %}
 
 <li>
-    <a {{ attributes.defaults({class: 'dropdown-item', href: url}|merge(htmlAttributes)) }}>
-        {%- if icon %}<twig:ea:Icon {{ ...attributes.nested('icon').defaults({name: icon}) }} /> {% endif -%}
-        {%- if label is not empty -%}<span {{ attributes.nested('label') }}>{{ renderLabelRaw ? label|raw : label }}</span>{%- endif -%}
-    </a>
+    {% if 'a' == type %}
+        <a {{ attributes.defaults({class: 'dropdown-item', href: url}|merge(htmlAttributes)) }}>
+            {%- if icon %}<twig:ea:Icon {{ ...attributes.nested('icon').defaults({name: icon}) }} /> {% endif -%}
+            {%- if label is not empty -%}<span {{ attributes.nested('label') }}>{{ renderLabelRaw ? label|raw : label }}</span>{%- endif -%}
+        </a>
+    {% elseif 'form' == type %}
+        {% set form_id = 'form-' ~ random() %}
+        <form id="{{ form_id }}" action="{{ url }}" method="POST">
+            {% set css_class = 'dropdown-item ' ~ (htmlAttributes.class ?? '') %}
+            <button {{ attributes.defaults(htmlAttributes|merge({class: css_class, form: form_id})) }}>
+                {%- if icon %}<twig:ea:Icon {{ ...attributes.nested('icon').defaults({name: icon}) }} /> {% endif -%}
+                {%- if label is not empty -%}<span {{ attributes.nested('label') }}>{{ renderLabelRaw ? label|raw : label }}</span>{%- endif -%}
+            </button>
+        </form>
+    {% endif %}
 </li>

templates/crud/index.html.twig

@@ -169,6 +169,7 @@
                                                 <twig:ea:ActionMenu:ActionList>
                                                     {% for action in entity.actions %}
                                                         <twig:ea:ActionMenu:ActionList:Item
+                                                            type="{{ 'form' == action.htmlElement ? 'form' : 'a' }}"
                                                             class="{{ action.cssClass }}" url="{{ action.linkUrl }}"
                                                             icon="{{ action.icon }}" icon:class="action-icon"
                                                             htmlAttributes="{{ action.htmlAttributes }}"