Для создания формы добавления продукции в заказ на чистом JavaScript необходимо использовать HTML для создания самой формы и JavaScript для обработки данных, введенных пользователем.
Ниже приведен пример кода, который демонстрирует, как это можно сделать:
HTML-разметка:
<form id="orderForm"> <label for="productName">Название продукта:</label> <input type="text" id="productName" name="productName" required> <br> <label for="quantity">Количество:</label> <input type="number" id="quantity" name="quantity" required> <br> <button type="submit">Добавить в заказ</button> </form>
JavaScript-код для обработки данных из формы:
// Получаем ссылку на форму const form = document.getElementById('orderForm'); // Назначаем обработчик события "submit" (отправка формы) form.addEventListener('submit', function(event) { // Отменяем отправку формы по умолчанию (чтобы страница не перезагружалась) event.preventDefault(); // Получаем значения полей ввода const productName = document.getElementById('productName').value; const quantity = document.getElementById('quantity').value; // Создаем объект с данными заказа const order = { productName: productName, quantity: quantity }; // Выполняем дополнительные операции (например, отправка данных на сервер) // ... // Очищаем поля формы form.reset(); });
Вышеуказанный код добавляет обработчик события "submit" к форме. Когда пользователь нажимает на кнопку "Добавить в заказ", функция обработчика отменяет стандартное поведение отправки формы и извлекает значения, введенные в поля формы. Затем создается объект с данными заказа, который можно использовать для выполнения дополнительных операций или отправки данных на сервер. В данном случае, код просто сбрасывает значения полей формы.
Обратите внимание, что вы также можете добавить дополнительную валидацию данных, обработчики событий для валидации ввода и другую логику, в зависимости от ваших потребностей.
Надеюсь, это поможет вам создать форму добавления продукции в заказ на чистом JavaScript!