- Components
- Copy Markup
Advanced Forms
Tailwind CSS Copy Markup
The Copy Markup Component efficiently adds new fields in forms, such as extra address entries. It automates form expansion, ensuring consistency and saving time. Ideal for flexible form structures like dynamic surveys and registration forms.
Requires JS
Note that this component requires the use of our Copy Markup plugin, else you can skip this message if you are already using Preline UI as a package.
Select
Use with select
window.addEventListener('load', () => {
(function () {
const copyContent = HSCopyMarkup.getInstance('#hs-copy-select-content');
if (copyContent) {
copyContent.on('copy', (el) => {
const select = el.querySelector('[data-hs-select]');
new HSSelect(select);
});
}
})();
});
Predefined markup
A predefined markup that hidden by default, and only copies after "add" button was clicked.
Modal example
Basic usage in modal window.
window.addEventListener('load', () => {
(function () {
const copyContent = HSCopyMarkup.getInstance('#hs-copy-select-with-modal-content');
if (copyContent) {
copyContent.on('copy', (el) => {
const select = el.querySelector('[data-hs-select]');
new HSSelect(select);
});
}
})();
});
