Вот пример реализации формы добавления продукции в заказ с использованием чистого JavaScript:
```html
<!DOCTYPE html>
<html>
<head>
<title>Форма добавления продукции в заказ</title>
<style>
#products { display: flex; flex-wrap: wrap; }
.product { margin: 10px; padding: 10px; border: 1px solid #ccc; width: 200px; }
</style>
</head>
<body>
<h1>Форма добавления продукции в заказ</h1>
<div id="products">
<div class="product">
<h2>Товар 1</h2>
<p>Цена: $10</p>
<button onclick="addToCart('Товар 1', 10)">Добавить в корзину</button>
</div>
<div class="product">
<h2>Товар 2</h2>
<p>Цена: $20</p>
<button onclick="addToCart('Товар 2', 20)">Добавить в корзину</button>
</div>
<!-- Добавьте остальные товары здесь -->
</div>
<h2>Корзина</h2>
<ul id="cart"></ul>
<script>
// Создаем пустую корзину
var cart = [];
// Функция добавления товара в корзину
function addToCart(product, price) {
cart.push({ product: product, price: price });
updateCart();
}
// Функция обновления корзины
function updateCart() {
var cartElement = document.getElementById("cart");
cartElement.innerHTML = "";
var total = 0;
// Перебираем товары в корзине и добавляем их в список
for(var i = 0; i < cart.length; i++) {
var item = cart[i];
var li = document.createElement("li");
li.innerHTML = item.product + " ($" + item.price + ")";
cartElement.appendChild(li);
total += item.price;
}
var li = document.createElement("li");
li.innerHTML = "Итого: $" + total;
cartElement.appendChild(li);
}
</script>
</body>
</html>
```
Этот пример создает форму добавления товаров в корзину. Каждый товар представлен в виде блока с названием, ценой и кнопкой "Добавить в корзину". При нажатии на кнопку, функция `addToCart` вызывается с параметрами продукта и его цены. Эта функция добавляет товар в массив `cart` и вызывает `updateCart` для обновления списка корзины.
Функция `updateCart` очищает список корзины, затем перебирает все товары в массиве `cart`, создает соответствующий элемент списка и добавляет его к списку корзины. Также вычисляется и выводится общая стоимость заказа.
Надеюсь, это поможет вам реализовать функционал добавления товаров в корзину с использованием чистого JavaScript.
