fixed order popup

This commit is contained in:
Bronku 2025-01-27 16:02:27 +01:00
parent cdd60a01f7
commit ec24dace6a
7 changed files with 55 additions and 30 deletions

5
public/alpine-3.14.8.js Normal file

File diff suppressed because one or more lines are too long

4
public/confirmation.html Normal file
View file

@ -0,0 +1,4 @@
<div id="order_confirmation" hx-get="new_order.html" hx-swap="outerHTML">
<button hx-get="new_order.html" hx-target="#order_confirmation" hx-swap="outerHTML" x-on:click="open = false">Back</button>
<button hx-get="new_order.html" hx-target="#order_confirmation" hx-swap="outerHTML">New Order</button>
</div>

View file

@ -5,13 +5,17 @@
<title>IROON</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<script src="htmx-2.04.js"></script>
<script defer src="alpine-3.14.8.js"></script>
</head>
<body>
<header>
<h1>I ran out of names</h1>
</header>
<main>
<button hx-get="/order/new" hx-swap="afterend">New Order</button>
<div id="new_order" x-data="{open:false}">
<button x-on:click="open = !open" x-show="!open">New Order</button>
<form hx-get="new_order.html" hx-swap="innerHTML" hx-trigger="load"></form>
</div>
</main>
</body>
</html>

16
public/new_order.html Normal file
View file

@ -0,0 +1,16 @@
<form x-show="open" hx-get="confirmation.html" hx-swap="outerHTML">
<div>
<label for="firstname">First Name</label>
<input type="text" id="firstname" name="firstname" value="">
</div>
<div >
<label for="lastname">Last Name</label>
<input type="text" id="lastname" name="lastname" value="">
</div>
<div >
<label for="phone">Phone</label>
<input type="tel" id="phone" name="phone" value="">
</div>
<button type="button" x-on:click="open = false">Cancel</button>
<button type="submit">Submit</button>
</form>