changed basket to a table

This commit is contained in:
bronku 2025-04-06 22:37:02 +02:00
parent 8ec446ea28
commit 923b575bc1
4 changed files with 34 additions and 45 deletions

View file

@ -1,33 +1,30 @@
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 + "]");
function addCake(id, name, price, amount) {
const cake = document.querySelector(`[name="cake[${id}]"]`);
if (cake != null) {
const value = Number(cake.getAttribute("value"));
cake.setAttribute("value", value + 1);
cake.value = Number(cake.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);
let template = document.getElementById("basket_element_template");
let tr = template.content.querySelector("tr").cloneNode(true);
tr.querySelector(".cake-name").innerText = name;
tr.querySelector(".cake-price").innerText = `${price}PLN`;
tr.querySelector(".cake-total").innerText = `${price * amount}PLN`;
tr.querySelector("button").onclick = () => {
tr.remove();
};
let input = tr.querySelector("input");
input.onchange = () => {
tr.querySelector(".cake-total").innerText = `${price * input.value}PLN`;
};
input.value = amount;
input.name = `cake[${id}]`;
document.querySelector("#basket_table").appendChild(tr);
}
function removeCake(id) {
document.getElementById("li[" + id + "]").remove();
function toggleDetails(row) {
const detailsRow = row.nextElementSibling;
if (detailsRow.classList.contains("hidden")) {
detailsRow.classList.remove("hidden");
return;
}
detailsRow.classList.add("hidden");
}