49 lines
No EOL
2 KiB
HTML
49 lines
No EOL
2 KiB
HTML
<form x-show="open" hx-post="order/new" hx-swap="outerHTML" x-data="{cakes:[]}" id="new_cake_form">
|
|
<div>
|
|
<label for="firstname">First Name</label>
|
|
<input type="text" id="firstname" name="firstname" required 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>
|
|
<div>
|
|
<label for="location">Location</label>
|
|
<input type="text" id="location" name="location" value="">
|
|
</div>
|
|
<div>
|
|
<label for="paid">Paid</label>
|
|
<input type="number" id="paid" name="paid" step="0.01" min="0" value="">
|
|
</div>
|
|
<select id="dropdown">
|
|
<option value="">Select an item...</option>
|
|
{{range .Cakes}}
|
|
<option value="{{.ID}}">{{.Name}}</option>
|
|
{{end}}
|
|
</select>
|
|
<button type="button" x-on:click="open = false">Cancel</button>
|
|
<button type="submit">Submit</button>
|
|
<script>
|
|
const dropdown = document.getElementById("dropdown")
|
|
dropdown.addEventListener("change", function () {
|
|
const label = document.createElement('label')
|
|
label.innerText = this.options[this.selectedIndex].text
|
|
label.setAttribute("for", "cake[" + this.value + "]")
|
|
const input = document.createElement('input')
|
|
input.setAttribute("type", "number")
|
|
input.setAttribute("id", "cake[" + this.value + "]")
|
|
input.setAttribute("name", "cake[" + this.value + "]")
|
|
input.setAttribute("value", 1)
|
|
const selected = document.createElement('div')
|
|
selected.appendChild(label)
|
|
selected.appendChild(input)
|
|
console.log(selected)
|
|
const parent = document.getElementById("new_cake_form")
|
|
parent.appendChild(selected)
|
|
})
|
|
</script>
|
|
</form> |