Insert en bd elementos dinámicos

[andvilla07]

Saludos amigos.

Estoy trabajando en un formulario, que clona las filas de una tabla, filas que contienen unos select y una caja de texto, utilizando para ello javascript y la librería jquery.

La duda a resolver es cómo envío la cantidad de selects adicionanos, no se si me haga explicar, pero para aclararlo, espero sirva, pongo este ejemplo funcional en php:

Código HTML:

<select name='calificacion$i'>
<option value="0">Seleccionar</option>
<option value="1">ingles</option>
<option value="2">frances</option>
</select> 

Dónde $i sería el número de selects que se van creando; pero no logro acoplar esa referencia ($i) en mi script.

Dejo el código de lo que hasta el momento tengo en funcionamiento:

Código:

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    $(".idi").change(function(){
            var tr =  $(this).parent().parent();
            idi = $(this).val();
            $.post("getHorarios.php", { idi: idi }, 
                         function(data){
                            tr.find("#hori").html(data); 
            });
   })
   
    $("#adicional").on('click', function(){
	  var row = $("#tabla tbody tr:eq(0)").clone(true).removeClass('fila-fija'); 
      row.find('.hori').empty();
      row.appendTo("#tabla tbody")
      var count = $("#tabla tbody tr").length;
      $("#count").val(count);
	});
    
    $(".eliminar").on("click",function(){
      var parent = $(this).closest("tr").remove();
      var count = $("#tabla tbody tr").length;
      $("#count").val(count)-1;
    }); 
	
	
$("#form").submit(function(e){ 
e.preventDefault(); 
var datos = $('#form').serialize();  
$.ajax({ 
type: "POST", 
url: "num_cu4.php", 
data: datos, 
dataType: "json", 
success: function(data){
                $('#resp').html(data); 
            }
})
});
	
}); 
</script>

Código HTML:

<table align='center'><tr><td align=center><div><button id='adicional' name='adicional' type='button'>Fila +</button></div></td></tr></table>"

<form id='form'>

<table align=center class='normal' id='tabla'><thead>
		<tr bgcolor=\"$color\">
			<th>Idioma</th>
			<th>Horario</th>
			<th>Grupos</th>
			<th>Opciones</th>
		</tr>
	</thead><tbody><tr bgcolor=\"$color\"><td align=center>
<select class="idi" name="idi []">
                               <option value="0">Seleccionar</option>
                               <option value="1">ingles</option>
                               <option value="2">frances</option>
</select>
<td align=center> 
<select class="hori campo" id="hori" name="hori[]"></select>
</td><td align=center><input name='grupos[]' type='text' id='grupos[]' maxlength='2' /></td>
<td class="eliminar" align=center><input type="button" value="-"/></td>
</tr>";
</tbody></table><br>
<button type='submit' name='submit' id='ok'>Aceptar</button>
</center>
<table align='center'><tr><td align=center><div><input name='count' id='count' type='hidden'/></div></td></tr></table></form>
}	
<div id="resp"></div> 

Cómo se puede observar, a medida que se da clic en el botón "fila +", se crea una nueva fila con los select dinámicos y una caja de texto, y necesito enviar cada uno de los datos que se creen e insertarlos en la bd. Sé que debe ser algo básico, pero no logro apreciar qué es, por eso acudo a ustedes por ayuda.

Muchas gracias por los aportes que puedan brindarme.

[aams01]

Podrias crear un arreglo con java y posterior a ello enviarlo y leerlo