Somar campos em reais e adicionar itens
by thvinic
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Receipt Form with LocalStorage</title>
</head>
<body>
<form id="receiptForm">
<label for="itemName">Item Name:</label>
<input type="text" id="itemName" name="itemName"><br>
<label for="itemValue">Item Value:</label>
<input type="number" id="itemValue" name="itemValue"><br>
<button type="button" id="addItemButton">Add Item</button>
</form>
<ul id="itemList"></ul>
<div id="totalValue"></div>
<script>
const addItemButton = document.getElementById("addItemButton");
const itemList = document.getElementById("itemList");
addItemButton.addEventListener("click", () => {
const itemName = document.getElementById("itemName").value;
const itemValue = document.getElementById("itemValue").value;
// Get existing items from localStorage
const items = JSON.parse(localStorage.getItem("items")) || [];
// Add new item to array
items.push({ name: itemName, value: itemValue });
// Store updated items in localStorage
localStorage.setItem("items", JSON.stringify(items));
// Clear form fields
document.getElementById("itemName").value = "";
document.getElementById("itemValue").value = "";
// Recreate item list
renderItemList();
});
function renderItemList() {
itemList.innerHTML = "";
const items = JSON.parse(localStorage.getItem("items")) || [];
for (const item of items) {
const li = document.createElement("li");
li.textContent = `${item.name}: R$ ${item.value}`;
li.addEventListener("click", () => {
// Edit item
const newName = prompt("Enter new name", item.name);
const newValue = prompt("Enter new value", item.value);
...