Design System

Add More - Under Experimentation

plos_add_more is built with HTMX to enable progressive enhancement. HTMX is not required. Without it, add and delete buttons submit the surrounding form normally and the page view handles everything. When HTMX.js is loaded, those same buttons instead POST to htmx_url and swap only the list container in place, without a full page reload. The swap target is the component's outer <div id="{name}-add-more">; the endpoint must return only that element.


Notes of Concern

Note this is still an experimental feature which may not work. Using two or more patterns, particularly the Add More Pattern, on any given page will cause rendering issues and odd behavior.


Interactive demo

Add and remove patents below. HTMX will swap the list without a full page reload. If you disable JavaScript the form will still work via full POST.

Patent 1

The official number or reference used to identify the patent or application
Patent application filing date
The date the patent application was first submitted. For example, 27 3 2025.

You can add 9 more patents