extracted js to order.js

This commit is contained in:
bronku 2025-04-06 17:50:05 +02:00
parent 736a390bc8
commit 8ec446ea28
3 changed files with 34 additions and 35 deletions

View file

@ -0,0 +1,33 @@
function addCake(id, name, amount) {
let template = document.getElementById("basket_element_template");
let tr = template.content.cloneNode(true);
console.log(tr);
const cake = document.getElementById("cake[" + id + "]");
if (cake != null) {
const value = Number(cake.getAttribute("value"));
cake.setAttribute("value", value + 1);
return;
}
const label = document.createElement("label");
label.innerText = name;
const input = document.createElement("input");
input.setAttribute("id", "cake[" + id + "]");
input.setAttribute("type", "number");
input.setAttribute("min", "0");
input.setAttribute("name", "cake[" + id + "]");
input.setAttribute("value", amount);
const button = document.createElement("button");
button.setAttribute("type", "button");
button.setAttribute("onClick", "removeCake(" + id + ")");
button.innerText = "usuń";
const li = document.createElement("li");
li.appendChild(label);
li.appendChild(input);
li.appendChild(button);
li.setAttribute("id", "li[" + id + "]");
const ul = document.getElementById("basket");
ul.appendChild(li);
}
function removeCake(id) {
document.getElementById("li[" + id + "]").remove();
}

View file

@ -6,6 +6,7 @@
<meta charset="UTF-8" />
<title>{{template "title" .}}</title>
<script src="/static/htmx2.04.js" defer></script>
<script src="/static/order.js" defer></script>
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/fontawesome/css/fontawesome.min.css">
<link rel="stylesheet" href="/static/fontawesome/css/solid.css">

View file

@ -93,41 +93,6 @@
</tr>
</template>
<script>
function addCake(id, name, amount) {
let template = document.getElementById("basket_element_template");
let tr = template.content.cloneNode(true);
console.log(tr);
const cake = document.getElementById("cake[" + id + "]");
if (cake != null) {
const value = Number(cake.getAttribute("value"));
cake.setAttribute("value", value + 1)
return;
}
const label = document.createElement("label");
label.innerText = name
const input = document.createElement("input");
input.setAttribute("id", "cake[" + id + "]")
input.setAttribute("type", "number")
input.setAttribute("min", "0")
input.setAttribute("name", "cake[" + id + "]")
input.setAttribute("value", amount)
const button = document.createElement("button");
button.setAttribute("type", "button")
button.setAttribute("onClick", "removeCake(" + id + ")")
button.innerText = "usuń"
const li = document.createElement("li");
li.appendChild(label)
li.appendChild(input)
li.appendChild(button)
li.setAttribute("id", "li[" + id + "]")
const ul = document.getElementById("basket");
ul.appendChild(li)
}
function removeCake(id) {
document.getElementById("li[" + id + "]").remove()
}
{{range .Order.Cakes}}
addCake({{.ID}},'{{.Name}} ({{.Price}}PLN)', {{.Amount}})
{{end}}