Всем привет! Возникла нужда подключить калькулятор калорийности на сайте жены, но тут возникла загвоздка, как теперь получить все данные из заполненных input одним списком. Нужно вывести все указанные ингредиенты в отдельный блок DIV, чтобы каждый ингредиент был разделен запятой.
Имеется блок куда добавляется ингредиент, в блоке 3 input, в 1-й мы вводим ингредиент "помидор", во 2-й мы указываем вес "2", а в 3-й единицу измерения "шт". Получается в итоге "Помидор 2 шт".
Каждая новая строка с новыми полями для ввода сформирована таким образом:
<div class="form-box-cont">
<div class="form-box-ingrid">
<input type="text" placeholder="Название ингредиента" id="ingred2" name="ingred_group[1][ingredient][2][name]" value="">
</div>
<div class="form-box-inp">
<input type="text" placeholder="Кол-во" name="ingred_group[1][ingredient][2][value]" value="">
<input type="text" placeholder="Ед.Изм." id="unit2" name="ingred_group[1][ingredient][2][unit]" value="">
</div>
</div>
Соответственно нужно вытащить ингредиенты в таком формате: Допустим у нас имеется 5 ингредиентов, получаем на выходе в новом блоке "Помидор 2 шт, Огурец 1шт, Мука 200 гр, Соль по вкусу, Горошек 1 банка". Нужно чтобы весь получиный список выводился одной строкой.
Как это сделать не соображу никак? Потихоньку пытаюсь учить JS, но сложновато пока дается.
Сам код формирования полей для ввода:
Прошу у вас помощи.
Вот код формирования списков для внесения ингредиентов: