It is necessary to transfer a lot of radiobutton from one form to the second, how can this be done better?

Question

There is a lot of input type="radio" in one form, PopUp-ом opens the second, when you click to узнать результат . It is necessary to transfer all selected input type="radio" secondly, in order to send it in a return letter. How to do it better? I heard about the serialization of form data, but it is impossible to implement, if not difficult, give an example, please. Thank you in advance. I enclose a fragment of the form code:

 <form class="need-sect__form" action="#"> <label class="need-sect__label">Вопрос</label> <div class="need-sect__check-container"> <label class="need-sect__check-block">Да <input type="radio" name="name1" value="yes"><span></span> </label> <label class="need-sect__check-block">Нет <input type="radio" name="name1" value="no" checked><span></span> </label> </div> <label class="need-sect__label">Вопрос</label> <div class="need-sect__check-container"> <label class="need-sect__check-block">Да <input type="radio" name="name2" value="yes"><span></span> </label> <label class="need-sect__check-block">Нет <input type="radio" name="name2" value="no"><span></span> </label> </div> <label class="need-sect__label">Вопрос</label> <div class="need-sect__check-container"> <label class="need-sect__check-block">Да <input type="radio" name="name3" value="yes"><span></span> </label> <label class="need-sect__check-block">Нет <input type="radio" name="name3" value="no"><span></span> </label> </div> <div class="need-sect__btns"> <a class="popup-with-zoom-anim def-btn" href="#small-dialog">Узнать результат </a> </div> </form>

Yes, but there is not one radioButton, and I need to transfer them all in one line to the second form, using jquery, the whole thing happens on one page.
Or do you want to transfer selected values from one form to another?
The second option is to transfer from one to another (in particular, in the input type = "hidden" in value).

Accepted Answer · 2018-03-15T12:10:09

 var btn = document.getElementById("btn"); btn.addEventListener("click", getValue) function getValue(){ var show = document.forms.show; var hidden = document.forms.hidden; for (var i=0; i<show.length; i++){ hidden[i].checked = show[i].checked; } }

 <form name="show">Show <label><input type="radio" name="r1">Да</label> <label><input type="radio" name="r1">Нет</label> <label><input type="radio" name="r1">Наверное</label> </form> <br> <form name="hidden">Hidden <label><input type="radio" name="r1">Да</label> <label><input type="radio" name="r1">Нет</label> <label><input type="radio" name="r1">Наверное</label> </form> <button id="btn" type="button">Передать значения</button>

UPD:

 var btn = document.getElementById("btn"); btn.addEventListener("click", getValue) function getValue(){ var show = document.forms.show; var hidden = document.forms.hidden; for (var i=0; i<show.length; i++){ if (show[i].checked == true){ hidden[0].value = show[i].value; console.log(hidden[0].value ); } } }

 <form name="show">Show <label><input type="radio" name="r1" value="1">Да</label> <label><input type="radio" name="r1" value="2">Нет</label> <label><input type="radio" name="r1" value="3">Наверное</label> </form> <form name="hidden">Hidden <label><input type="hidden" name="r1"></label> </form> <button id="btn" type="button">Передать значения</button>

So, it will only work in conditions where from one input to another transfer of the same type, but not Hidden, and you need to transfer all questions with the class <label class = "need-sect__label"> Question1 </ label> <label class = " need-sect__label "> Question2 </ label> one line into another form into one input only
So questions transfer or выбранные значения (answers)?

It is necessary to transfer a lot of radiobutton from one form to the second, how can this be done better?

1 answer 1

More articles: