<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form id="someid">
<input name="pole1" value="" type="text"><br>
<input name="pole2" value="" type="text">
<br>
<input name="b1" value="1" type="radio">
<input name="b1" value="2" type="radio">
<input name="b1" value="3" type="radio">
<input name="b1" value="4" type="radio">
<br>
<input name="itog-pole1-b1" value="" type="text"><br>
<input name="itog-pole2-b1" value="" type="text"><br>
<br>
<input name="itog-pole1-b2" value="" type="text"><br>
<input name="itog-pole2-b2" value="" type="text"><br>
<br>
<input name="itog-pole1-b3" value="" type="text"><br>
<input name="itog-pole2-b3" value="" type="text"><br>
<br>
<input name="itog-pole1-b4" value="" type="text"><br>
<input name="itog-pole2-b4" value="" type="text"><br>
</form>
<script>
Array.prototype.slice.call( document.querySelectorAll('#someid input[name^="pole"]') ).forEach(function(el) {
el.oninput = function() {
var checkedRadio = this.form.querySelector('input[type="radio"]:checked');
if (!checkedRadio) return;
var radioVal = checkedRadio.value;
var targetInput = this.form.querySelector('input[name="itog-'+this.name+'-b'+radioVal+'"]');
if (targetInput) targetInput.value = this.value;
}
});
Array.prototype.slice.call( document.querySelectorAll('#someid input[type="radio"]') ).forEach(function(el) {
el.onclick = function() {
var hiddenInputs = this.form.querySelectorAll('input[name^="itog-pole"]');
Array.prototype.slice.call(hiddenInputs).forEach(function(el) { el.value = ''; });
var pole1Target = this.form.querySelector('input[name="itog-pole1-b'+this.value+'"]');
var pole2Target = this.form.querySelector('input[name="itog-pole2-b'+this.value+'"]');
if (pole1Target && pole2Target) {
pole1Target.value = this.form.elements['pole1'].value;
pole2Target.value = this.form.elements['pole2'].value;
}
}
});
</script>
</body>
</html>