hx-pod

An amazingly simple file uploading form *with a progress bar* using htmx:<form id='form'       hx-encoding='multipart/form-data'       hx-post='/[where-you-want-post-it]'      hx-target='#target-div'>    <input type="hidden" name="_token" value="" />    <input type='file' name='file'>    <button>        Upload    </button>    <progress id='progress' value='0' max='100'></progress></form><script>    htmx.on('#form', 'htmx:xhr:progress', function(evt) {      htmx.find('#progress').setAttribute('value', evt.detail.loaded/evt.detail.total * 100)    });</script>

What if you could "select" snippets out of your response and send them to anywhere on the page ("out-of-band") of the target?that's hx-select-oob Server traffic cop: hx-swap-oobClient traffic cop: hx-select-oob

Let's talk big ideas like Locality of Behavior vs. Separation of Concerns by relentlessly attacking one of the best websites ever created

Set the outer layer of settings of your request with THESE THREE OPTIONS

Question: Do you want your users in the comment section to write htmx that runs on your site?If the answer is yes, please ignore this episode.

What if you don't want your page kept into the browser history local storage?

This is a somewhat open thought process looking at the question I see online: what is htmx good for?Mentioned in the episode: the htmx movies example from Andrew Rhyand:https://htmx.andrewrhyand.com/A great looking page with smooth animations and educational htmx content on it.

Your browser has built in types and validation on inputs in a form. But what happens when you use inputs without a form??Note: I accidentally posted an incomplete episode at first, if you dont hear the end, try to re-download!

Every request has secret hidden headers. But what if you wanted to make your own?https://htmx.org/attributes/hx-headers/