estoy clonando filas de una tabla en base a una una fila ya impresa con html, el script me clona todo correcto, sin embargo, los names de los input me los pone todos iguales, eso no representa un problema a excepcion de un input file, que al tener el mismo name en todas las filas clonadas no me permite subir una imagem individual por cada registro. Desearia solo cambiar el id de ese input file y el label asociado, vi un ejemplo de como hacerlo pero en dicho ejemplo unicamente se clonaba un div y en mi caso yo clono un tr con 23 td donde cada uno tiene su propio input.
function
<script>
$(function () {
// Clona la fila oculta que tiene los campos base, y la agrega al final de la tabla
$("#adicional").on('click', function () {
$("#tabla tbody tr:eq(0)").clone().removeClass('fila-fija').appendTo("#tabla");
});
// Evento que selecciona la fila y la elimina
$(document).on("click", ".eliminar", function () {
var parent = $(this).parents().get(0);
$(parent).remove();
});
});
</script>
el form que contiene la tabla sobre la cual clono el tr
<form method="post" enctype="multipart/form-data">
<table class="table_crud" id="tabla">
<tr class="fila-fija">
<!-- <td><input required name="idalumno[]" placeholder="ID Alumno"/></td>
<td><input required name="nombre[]" placeholder="Nombre Alumno"/></td>
<td><input required name="carrera[]" placeholder="Carrera"/></td>
<td><input required name="grupo[]" placeholder="Grupo"/></td> -->
<td> <input type='text' size='15' name='rfc[]' placeholder="RFC"></td>
<td> <input type='text' size='24' name='curp[]' placeholder="CURP"> </td>
<td> <input type='text' size='11' name='nss[]' placeholder="NSS"></td>
<td> <input type='text' size='12' name='nombre[]' placeholder="Nombre"> </td>
<td> <input type='text' size='12' name='ap[]' placeholder="Apellido P"></td>
<td> <input type='text' size='12' name='am[]' placeholder="Apellido M"></td>
<td><select name='gen[]'>
<option disabled selected> G </option>
<option value='F'>F</option>
<option value='M'>M</option>
</select>
</td>
<td> <input type='date' style='width: 100px' name='fn[]'></td>
<td><select name='ec[]'>
<option disabled selected>E.C</option>
<option value="Soltero">Soltero</option>
<option value="Casado">Casado</option>
<option value="Divorciado">Divorciado</option>
<option value="Viudo">Viudo</option>
</select>
</td>
<td> <input type='text' name='calle[]' placeholder="Calle"></td>
<td> <input type='text' name='ne[]' placeholder="Número exterior"></td>
<td> <input type='text' name='cp[]' placeholder="Código postal"></td>
<td> <input type='text' name='colonia[]' placeholder="Colonia"></td>
<td> <input type='text' name='municipio[]' placeholder="Municipio"></td>
<td> <input type='text' name='tel[]' placeholder="Teléfono"></td>
<td> <input type='email' name='correo[]' placeholder="Correo"></td>
<td><select name='sucursal[]'>" ?>
<option disabled selected>Sucursal</option>
<option>Miniso Altacia León</option>
<option>Miniso Vía Alta Salamanca</option>
<option>Miniso Alaia Guanajuato</option>
<option>Miniso León Centro</option>
<option>Miniso Plaza Mayor</option>
<option>Miniso La Luciernaga</option>
<option>Miniso Parque Celaya</option>
<option>Miniso Galerías Celaya</option>
<option>Miniso Centro Max</option>
<option>Miniso Cibeles Irapuato</option>
</select></td>
<td> <select name='cargo[]'>
<option disabled selected>Cargo</option>
<option>Gerente</option>
<option>Subgerente</option>
<option>Analista de soporte técnico</option>
<option>Promotor de ventas</option>
<option>Monitorista</option>
<option>Auxiliar de salud y belleza</option>
<option>Auxiliar de inventarios</option>
<option>Auxiliar de tiendas</option>
<option>Cajero</option>
</select></td>
<td> <input type='date' name='incon[]'></td>
<td> <input type='time' name='he[]'></td>
<td> <input type='time' name='hs[]'></td>
<td> <input type='text' size='7' name='sueldo[]' placeholder="Sueldo"></td>
<td> <img src='./img/curriculum/emple.png' class='fotos_crud_exis' width='100px' id='foto'
name='foto'>
</td>
<td> <label for='fotos' class='btn_photo'><i class='fa-solid fa-image-portrait'></i> <i
class='fa-solid fa-arrow-up-from-bracket'></i></label>
<input type='file' name='fotos[]' id='fotos' class='filecrud' onchange='mostrarimagen(this)'>
</td>
<td class="eliminar"><input type="button" value="Menos -" /></td>
</tr>
</table>
<div class="btn-der">
<input type="submit" name="insertar" value="Insertar empleado" class="daralta" />
<button id="adicional" name="adicional" type="button" class="daralta"> Más + </button>
</div>
</form>
input sobre el cual deseo poder cambiar el name, ejemplo, a fotosq, fotos2, fotos3, dependiendo de cuantas filas se inserten mediante el boton "mas"
<label for='fotos' class='btn_photo'><i class='fa-solid fa-image-portrait'></i> <i
class='fa-solid fa-arrow-up-from-bracket'></i></label>
<input type='file' name='fotos[]' id='fotos' class='filecrud' onchange='mostrarimagen(this)'>
esto es lo que trato de explicar, no se que estoy haciendo mal :(