ipfgr
@ipfgr
Js like hobby

Из каждого div получить 4 строчки input и положить значение в массив, затем создать обьект с этим массивом?

Добрый день. Помогите пожалуйста советом.
есть форма для заполнения, код выглядит следующим образом
<div class="input-container" >
                <input type="text" name="parametr" class="custom-input body-input" placeholder="Parametr">
                <input type="text" name="result" class="custom-input body-input" placeholder="Result">
                <select class="custom-input body-input">
                <option value="10^9L">10^9L</option>
                <option value="%">%</option>
                <option value="g/dL">g/dL</option>
                <option value="fL">fL</option>
                <option value="pg">pg</option>
                <option value="fl">fl</option>
                <option value="mg/L">mg/L</option>
                <option value="g/L">g/L</option>
                <option value="mmol/L">mmol/L</option>
                <option value="umol/L">umol/L</option>
                <option value="Ery/uL">Ery/uL</option>
                <option value="none">none</option>
                </select>
                <input type="text" name="range" class="custom-input body-input" placeholder="Normal Range">
                <div class="remove-line" data-name="${counter}">
                                &times;
                              </div>
            </div>


Количество таких блоков может быть от одного до 20. Оно меняется динамически когда пользователь нажимает кнопку добавить строку.
Мне нужно сделать следующее.
Допустим блоков у меня 3

На выходе я должен получить вот такой объект
let context = {
input1: [ "parametr.value", "result.value" , "select.value" , "range.value" ],
input2: [ "parametr.value", "result.value" , "select.value" , "range.value" ],
input3: [ "parametr.value", "result.value" , "select.value" , "range.value" ],
}


Не стану описывать как я извращался с forEach и хотел сделать через цикл for с ограничением в 4 , чтобы после того как цикл forEach снимет 4 значения и сделает их push в массив , он переходил к созданию следующего объекта. В общем я в тупике, прошу подсказки. Спасибо
  • Вопрос задан
  • 130 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
Добавить select'ам атрибут name, как у input'ов.

const data = Array
  .from(document.querySelectorAll('.input-container'))
  .reduce((acc, el, i) => (
    acc[`input${i + 1}`] = [
      'parameter',
      'result',
      'select',
      'range',
    ].map(name => el.querySelector(`[name="${name}"]`).value),
    acc
  ), {});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы