kieranbarker · June 26, 2025 08:16
diff --git a/delete-form.html b/delete-form.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<title>Delete Form</title>
 </head>
 <body>
 	<delete-form>
 		<form action="/widgets/1/delete" method="post">
 			<p>
 				<button type="submit">Delete Widget</button>
 			</p>
 		</form>
 	</delete-form>
 	<script>
 		customElements.define("delete-form", class extends HTMLElement {
 			constructor() {
 				super();
 				this.form = this.querySelector("form");

 				if (this.form) {
 					this.form.addEventListener("submit", this);
 				}
 			}

 			handleEvent(event) {
 				event.preventDefault();

 				if (confirm("Are you sure you want to delete this widget?")) {
 					this.form.submit();
 				}
 			}
 		});
 	</script>
 </body>
 </html>