htmx Workshop v10

# Workshop UI Examples

You can find all exaples running in Azure to test and explore.

htmx examples on Azure

https://htmx-examples-anbva9b7gkhtgfbd.centralus-01.azurewebsites.net/

htmx examples GitHub repo

https://github.com/cwoodruff/htmx-examples-for-workshop

Pattern	Description
Click To Edit	Demonstrates inline editing of a data object
Bulk Update	Demonstrates bulk updating of multiple rows of data
Click To Load	Demonstrates clicking to load more rows in a table
Delete Row	Demonstrates row deletion in a table
Edit Row	Demonstrates how to edit rows in a table
Lazy Loading	Demonstrates how to lazy load content
Inline Validation	Demonstrates how to do inline field validation
Infinite Scroll	Demonstrates infinite scrolling of a page
Active Search	Demonstrates the active search box pattern
Progress Bar	Demonstrates a job-runner like progress bar
Tabs --	Demonstrates how to display and select tabs using HATEOAS principles
Value Select	Demonstrates making the values of a select dependent on another select
File Upload	Demonstrates how to upload a file via ajax with a progress bar
Dialogs - Bootstrap	Demonstrates the prompt and confirm dialogs using Bootstrap
Dialogs - UIKit	Demonstrates modal dialogs using UIKit
Dialogs - Custom	Demonstrates modal dialogs from scratch
Keyboard Shortcuts	Demonstrates how to create keyboard shortcuts for htmx enabled elements
Drag & Drop with Sorting	Demonstrates how to use htmx with the Sortable.js plugin to implement drag-and-drop reordering
Animations	Demonstrates various animation techniques