Skip to content

Instantly share code, notes, and snippets.

View pauloevpr's full-sized avatar

Paul Roque pauloevpr

View GitHub Profile
@pauloevpr
pauloevpr / hx-clone.js
Created January 7, 2024 19:47
Simple HTMX extension to allow cloning <template> elements in the DOM to avoid a round trip to the server.
htmx.config.useTemplateFragments = true
htmx.defineExtension('clone', {
onEvent: function (name, evt) {
if (name === 'htmx:beforeRequest') {
if (evt.detail.elt) {
const get = evt.detail.elt.getAttribute('hx-get')
if (get && get.startsWith('clone:')) {
const selector = get.substring(6)
//console.log('htmx-clone: Intercepting xhr request to inject template with selector:', selector)
const template = document.querySelector(selector)