Añado una respuesta funcional, con Vainilla JS y el código PHP necesario para construir dinámicamente el formulario.
Fichero con el código para construir el formulario y realizar los cálculos mediante JS:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Formulario dinámico</title>
</head>
<body>
<form method="POST" action="procesar.php" name="fm">
<?php
$n_rows = 5;
//Imprime rows
for ( $i = 1; $i <= $n_rows; $i++ ) {
?>
<div style="display: block; margin: 1% 0">
<input type="text"
id="row<?php echo $i; ?>_input1"
name="a[]"
onChange="multiplicar(<?php echo $i; ?> )">
<input type="text"
class="form-control"
id="row<?php echo $i; ?>_input2"
name="b[]"
onChange="multiplicar(<?php echo $i; ?> )">
<input type="text"
class="form-control"
id="row<?php echo $i; ?>_output"
name="resultado[]">
</div>
<?php
} //end for
?>
<input type="button" value="Enviar" onclick="send()">
</form>
<script type="text/javascript">
function $( id ) {
console.log( "$() -> ID: " + id );
return document.getElementById( id );
}
function multiplicar( row ) {
console.log( "multiplicar()" );
//console.log( document.readyState );
var str_input = "row" + row + "_input",
str_output = "row" + row + "_output",
temp,
valor1,
valor2;
//Assigns values
temp = $( str_input + 1 ).value;
valor1 = ( temp ) ? temp : 1;
temp = $( str_input + 2 ).value;
valor2 = ( temp ) ? temp : 1;
//Sets results
$( str_output ).value = valor1 * valor2;
}
function send() {
console.log( "send()" );
document.fm.submit();
}
</script>
</body>
</html>
Página PHP para procesar el formulario:
<?php
echo "Resultados: <br><pre>";
if ( $_POST ) {
var_dump( $_POST );
die();
}