HTMX was added to Drupal 11.3.x.
Adding this url argument tells drupal to deliver an HTMX response, which is the requested page's main content.
?_wrapper_format=drupal_htmx
For example, add this to your page.html.twig template.
<button
hx-get="/node/1?_wrapper_format=drupal_htmx"
hx-target="#content-container"
>Click me</button>
<div id="content-container"></div>Clicking the button will load content from node 1 and insert it in the container.
These headers are included in the request when you click on the button:
HX-Request: true
HX-Target: dialog-container
HX-Current-URL: https://drupal11.ddev.site/Follow along
The current development plan.
HTMX
Drupal 11: Making Interactive Elements With HTMX
Intro to drupal htmx.
Replace AJAX API with HTMX
Community initiative page.
[Plan] Gradually replace Drupal's AJAX system with HTMX
Top level issue for the upgrade.
Update to htmx 4
Latest version compatibility, happening in Drupal 12. Almost ready.
jQuery/Ajax
[meta] Replace JQuery with vanilla Javascript in core
AJAX API uses jQuery. Need to convert to vanilla JS so we can remove it.
[PP-x] Remove jQuery Form dependency from misc/ajax.js
Superseded by HTMX upgrade.
[Plan] Provide guidance for refactoring existing Ajax API commands
List of AJAX API commands, which all need replacement.
JavaScript event handling without a full jQuery dependency
Need a way to call events from other scripts.
Views
[PoC] Use HTMX for (some?) ajax views
Refresh view from pagers, filters, sorts.
Dialog/Modal
Replace jQuery UI dialog that was driven with Ajax commands.
New system will be driven by server side htmx responses.
A simple web component was proposed by @latent.
Implement OpenModalDialogCommand in htmx
OpenModalDialogCommand
One of the big things from the jQuery/AJAX API.
[meta] Decide on where to use modal dialogs
Old issue for enhancing the admin UI with dialogs.
[META] Convert all confirm forms to use modal dialog
UX upgrade using new API.
Drupal Slack #HTMX - Replace jQuery dialog 7/27/26
Slack discussion on new modal/dialog for htmx.
Suggestion to use a dialog web component.
Add a native dialog element to deprecate the jQuery UI dialog
New dialog system, built with HTMX.
My Issues
Need a way to specify where the window scrolls when a swap happens.
For example, when a pager is clicked on a view, scroll to the top of the view/results.
Can we come up with a one size fits all rule, or do we need a way to customize in the view?
The AJAX API had a simple way to make a link load a page or form into a modal. Forms and links are automatically altered to have sensible behavior in the modal. For example, submitting the form over ajax and closing the modal.
