let title = document.getElementById('title');
let price = document.getElementById('price');
let taxes = document.getElementById('taxes');
let ads = document.getElementById('ads');
let discount = document.getElementById('discount');
let total = document.getElementById('total');
let count = document.getElementById('count');
let category = document.getElementById('category');
let submit = document.getElementById('submit');
function getTotal() {
if (price.value != '') {
let result = (+price.value + +taxes.value + +ads.value)
- +discount.value;
total.innerHTML = result;
total.style.background = '#040';
} else {
total.innerHTML = '';
total.style.background = '#a00';
}
}
function updataData() {
}
let dataPro;
if (localStorage.product != null) {
dataPro = JSON.parse(localStorage.product)
} else {
dataPro = [];
}
submit.onclick = function () {
let newPro = {
title: title.value,
price: price.value,
taxes: taxes.value,
ads: ads.value,
discount: discount.value,
total: total.innerHTML,
count: count.value,
category: category.value,
}
dataPro.push(newPro);
localStorage.setItem('product', JSON.stringify(dataPro))
clearData()
showData()
}
function clearData() {
title.value = '';
price.value = '';
taxes.value = '';
ads.value = '';
discount.value = '';
total.innerHTML = '';
count.value = '';
category.value = '';
}
function showData() {
let table = '';
for (let i = 0; i < dataPro.length; i++) {
table += `
<tr>
<td>${i}</td>
<td>${dataPro[i].title}</td>
<td>${dataPro[i].price}</td>
<td>${dataPro[i].taxes}</td>
<td>${dataPro[i].ads}</td>
<td>${dataPro[i].discount}</td>
<td>${dataPro[i].category}</td>
<td>${dataPro[i].total}</td>
<td><button id="updat">update</button></td>
<td><button onclick="deleteData(${i})" id="delete" onclick="deleteData(i)">delete</button></td>
</tr>
`
console.log(table)
}
document.getElementById('tbody').innerHTML = table;
let btnDelete = document.getElementById('deleteAll');
if (dataPro.length > 0) {
btnDelete.innerHTML =
<button onclick="deletAll()"> delete All</button>
} else {
btnDelete.innerHTML = '';
}
}
howData()
function deleteData(i) {
console.log(i)
}
function deletAll() {
localStorage.clear()
dataPro.splice(0)
showData()
}
jj.jsstyle.css
index.html