Конфигуратор нового товара на странице сайта

Если варианта с выбором товара недостаточно, либо количество модификаций очень велико, то может быть полезна функция "Произвольный товар", которая генерирует новый товар на странице вашего сайта (с ценой и названием) и отправляет его в корзину.

1 Сформируем группы возможных опций товара внутри общего DIV-контейнера и присвоим ему любое id, которое будет связано с кнопкой "купить".

У каждого INPUT есть параметры data-name и data-price - они используются для формирования названия нового продукта и его цены (названия склеиваются, цены складываются).

<div id="myConfig_1"> <!-- вместо "myConfig_1" можно указать свой ID, связанный с кнопкой "Купить" -->

	<!-- Стартовое название товара и начальная цена (disabled) -->
	<input type="checkbox" data-name="Пепперони" data-price="0"  checked disabled> <label>Пепперони</label>

	<!-- Выбранный элемент их первой группы myradio1 добавит к цене data-price, а к названию допишет data-name  -->
	<input type="radio" name="myradio1" data-name="большая" data-price="750" checked> <label>Большая (750 руб.)</label>
	<input type="radio" name="myradio1" data-name="средняя" data-price="525"> <label>Средняя  (525 руб.)</label>
	<input type="radio" name="myradio1" data-name="маленькая" data-price="380"> <label>Маленькая  (380 руб.)</label>

	<!-- Аналогично в название и цену товара будут добавлены параметры из выбранного элемента второй группы  -->
	<input type="radio" name="myradio2" data-name="обычная" data-price="0"  checked> <label>Обычная  (+ 0 руб.)</label>
	<input type="radio" name="myradio2" data-name="тонкая" data-price="30" > <label>Тонкая  (+30 руб.)</label>

	<!-- Можно продолжить создание групп для выбора дополнительных парамтров товара  -->


</div>

2 Кроме блока с товарами потребуется еще создать кнопку "Купить", которая создаст товар из выбранных опций и затем добавит его в корзину:

<button class="btn-ens-selected-self" data-div="myConfig_1">Купить</button>

Пепперони
Большая (750 руб.) Средняя (525 руб.) Маленькая (380 руб.)
Обычная (+0 руб.) Тонкая (+30 руб.) Купить

3 Для связки кнопки "Купить" и блока с опциями требуется добавить на страницу код (один раз, после кода подклчения корзины)

<script>
document.addEventListener("EasyNetShopLoaded", function(event) {

	// При клике на кнопку с классом btn-ens-selected-self
	ens_jQuery('.btn-ens-selected-self').click(function() { 

		// Задаем начальные значения для цены и названия товаров (пустые)
		let self_name = ''; 
		let self_price = 0; 

		// проверяем все отмеченные checkbox в связанном с кнопкой блоке
		ens_jQuery('#'+ens_jQuery(this).data('div')+' input:checked').each(function(){

			// добавляем фрагмент из data-name к названию товара
			self_name += ' ' + ens_jQuery(this).data('name'); 

			// добавляем цену из data-price к цене товара
			self_price += ens_jQuery(this).data('price');     
		});

	// Полученный товар добавляем в корзину
	easynetshop_self(self_name, self_price); 
	});
}, false);
</script>