Как записать в скрытое поле результат сложения значений атрибута?

[alexein66]

Всем привет

Есть JS который складывает значения атрибутов rel в чекбоксах формы и выводит в html <span id="result"></span>

const form = document.querySelector('form');

form.addEventListener('change', () => {
    form.querySelector('#result').innerText = Array
        .from(form.querySelectorAll(':checked'))
        .reduce((acc, n) => acc + +n.getAttribute('rel'), 0);
});

form.dispatchEvent(new Event('change'));

Как записать результат в value скрытого поля?

<input type="hidden" name="price" id="price" value="">

Благодарю за помощь

 

[Denzy]

Всем привет

Есть JS который складывает значения атрибутов rel в чекбоксах формы и выводит в html <span id="result"></span>

const form = document.querySelector('form');

form.addEventListener('change', () => {
    form.querySelector('#result').innerText = Array
        .from(form.querySelectorAll(':checked'))
        .reduce((acc, n) => acc + +n.getAttribute('rel'), 0);
});

form.dispatchEvent(new Event('change'));

Как записать результат в value скрытого поля?

<input type="hidden" name="price" id="price" value="">

Благодарю за помощь

HTML пример покажите ещё

 

[alexein66]

HTML пример покажите ещё

<form id="quiz">
<div class="checkbox-block">
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="checkbox" name="q2[]" rel="10000">
            <p> Чекбокс 1 </p>
        </label>
    </div>
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="checkbox" name="q2[]" rel="20000">
            <p> Чекбокс 2 </p>
        </label>
    </div>
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="checkbox" name="q2[]" rel="10000">
            <p> Чекбокс 3 </p>
        </label>
    </div>
</div>

<div class="radio-block-1">
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="radio" name="q3" rel="10000">
            <p> Радио 1 </p>
        </label>
    </div>
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="radio" name="q3" rel="20000">
            <p> Радио 2 </p>
        </label>
    </div>
  
</div>

<div class="radio-block-2">
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="radio" name="q4" rel="10000">
            <p> Радио 1 </p>
        </label>
    </div>
    <div class="quiz__answer--txt__wrap">
        <label class="quiz__answer--txt">
            <input type="radio" name="q4" rel="20000">
            <p> Радио 2 </p>
        </label>
    </div>
  
</div>
<span class="result"></span>
<input type="hidden" name="price" id="price" value="">
</form>

 

[Denzy]

const form = document.querySelector('form');
form.addEventListener('change', () => {
  form.querySelector('#price').innerText = Array
    .from(form.querySelectorAll(':checked'))
    .reduce((acc, n) => acc + +n.getAttribute('rel'), 0);
});

form.dispatchEvent(new Event('change'));

Попробуйте так

 

[alexein66]

Попробуйте так

В value не записывает. получаю на выходе

И хотелось бы чтобы в сюда тоже передавался результат <span class="result"></span>. То есть важно показать пользователю цифру и на почту отправить

 

[Denzy]

В value не записывает. получаю на выходе
Посмотреть вложение 5423
И хотелось бы чтобы в сюда тоже передавался результат <span class="result"></span>. То есть важно показать пользователю цифру и на почту отправить

<script>
const form = document.querySelector('form');

form.addEventListener('change', () => {
  form.price.value = Array
    .from(form.querySelectorAll(':checked'))
    .reduce((acc, n) => acc + +n.getAttribute('rel'), 0);
});
form.addEventListener('change', () => {
  form.querySelector('.result').innerText = Array
    .from(form.querySelectorAll(':checked'))
    .reduce((acc, n) => acc + +n.getAttribute('rel'), 0);
});

form.dispatchEvent(new Event('change'));
</script>