1

Hola muy buenas tardes a todos! Tengo el siguiente problema.

Tengo una tabla por defecto con una sola fila. Al final de la tabla tengo un boton para agregar una fila mas, entonces la segunda fila tiene el ID=2

Agrego una fila mas y la tercera va a tener el ID=3

Mi problema es: Si borro la segunda tabla, la tercera deberia pasar a ser ID=2. y no se como solucionarlo.

Una posible soluciòn que se me ocurre es que solamente se pueda borrar la ultima fila, asi no se produce èste incoveniente, pero como lo aplicaria??????

Èste es mi Codigo JS que funciona bien:

$(document).ready(function(){
    /////////////////////////////ADD TABLE ROW CODE///////////////////////////////////

    var i=1;
    $('#add').click(function(){
        if(i<5){
          i++;
          $('#dynamic_field').append('<tr id="row'+i+'"><td><input required type="text" name="nombre[]" id="name" class="form-control name" autocomplete="nope"></td><td><input required type="text" name="apellido[]" id="apellido" class="form-control apellido" autocomplete="nope"></td><td><input required type="text" name="vinculo[]" id="celular" class="form-control phone" autocomplete="nope"></td><td><input required type="text" name="ocupacion[]" id="ocupacion" class="form-control phone" autocomplete="nope"></td><td><input type="file" name="ingreso'+i+'" id="ingreso'+i+'"class="form-control files"></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">x</button></td></tr>');
        }else{
          alert("No se pueden agregar mas familiares.");
        }

     });
    /////////////////////////////REMOVE TABLE ROW CODE///////////////////////////////////
       $(document).on('click', '.btn_remove', function(){
           i = i - 1;
           var button_id = $(this).attr("id");
           $('#row'+button_id+'').remove();
      });
});

EDIT FUNCTION GRUPO FAMILIAR.

private function cargar_archivosgrupofamiliar($item1,$item2,$item3,$item4,$vinput="",$nombre=""){
            $mi_imagen = $vinput;
            $config2['upload_path'] = "./uploads/ingresofamiliar/";
            $config2['file_name'] = $nombre . $item1;
            $config2['allowed_types'] = "jpg|pdf|png|docx";
            $config2['max_size'] = "3000";
            $config2['max_width'] = "2000";
            $config2['max_height'] = "2000";
            // Solo cargar la librería
            $this->load->library('upload');
            // Inicializar para forzar configuración
            $this->upload->initialize($config2);
            if (!$this->upload->do_upload($mi_imagen)) {
                $archivo = "null";
            }else{
              $data['datos'] = $this->upload->data();
              $archivo = $data['datos']['file_name'];
            }
          $datafamiliar = array(
            'nombref' => $item1,
            'apellidof' => $item2,
            'vinculo' => $item3,
            'ocupacion' => $item4,
            'ingresos' => $archivo,
            'dni_becario' => $_POST['dni'],
          );
          $this->db->insert('grupo_familiar' , $datafamiliar);
          $data['datos'] = "";
          $archivo="";
      }

2 respuestas 2

1

Creo que estás usando el ID solo para contar la cantidad de filas y acceder a la que deseas eliminar, sin embargo, hay una opción más sencilla de lograrlo:

  • $(selector).length - Cuenta la cantidad de elementos que coinciden con el selector. Usa este para no permitir agregar más de 5 filas.
  • $(selector).closest(selectorPadre) - Obtiene el ancestro más cercano que coincide con selectorPadre. Úsalo para obtener la fila del botón que recibió clic y eliminarla.

$(document).ready(function() {
    $('#add').click(function() {
        if($('#dynamic_field tbody tr').length < 5) {
            $('#dynamic_field tbody').append('<tr><td><input required type="text" name="nombre[]" id="name" class="form-control name" autocomplete="nope"></td><td><input required type="text" name="apellido[]" id="apellido" class="form-control apellido" autocomplete="nope"></td><td><input required type="text" name="vinculo[]" id="celular" class="form-control phone" autocomplete="nope"></td><td><input required type="text" name="ocupacion[]" id="ocupacion" class="form-control phone" autocomplete="nope"></td><td><input type="file" name="ingreso[]" class="form-control files"></td><td><button type="button" name="remove" class="btn btn-danger btn_remove">x</button></td></tr>');
        } else {
            alert("No se pueden agregar mas familiares.");
        }
    });

    $(document).on('click', '.btn_remove', function() {
        // Desde el botón se puede obtener la fila y eliminar
        $(this).closest('tr').remove();
    });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="dynamic_field">
<tbody>
    <tr>
        <td><input required type="text" name="nombre[]" class="form-control name" autocomplete="nope"></td>
        <td><input required type="text" name="apellido[]" class="form-control apellido" autocomplete="nope"></td>
        <td><input required type="text" name="vinculo[]" class="form-control phone" autocomplete="nope"></td>
        <td><input required type="text" name="ocupacion[]" class="form-control phone" autocomplete="nope"></td>
        <td><input type="file" name="ingreso[]" class="form-control files"></td>
        <td><button type="button" name="remove" class="btn btn-danger btn_remove">x</button></td>
    </tr>
</tbody>
</table>

<button id="add">Agregar fila</button>

Esto te permite simplificar la lógica al evitando:

  • Tener una variable para contar elementos
  • Asignar o modificar ID innecesarios

Adicionalmente, en tu código estás repitiendo ID para campos nombre, apellido, vínculo y ocupación por cada fila, mientras que en ingreso estabas creando un campo con nombre variable, pero es mejor que también sea un arreglo name="ingreso[]".

Por defecto, CodeIgniter no permite subir más de un archivo (como arreglo), por lo que necesitas modificar $_FILES para cada archivo:

      // Antes de comenzar la subida "respaldas" $_FILES
      $files = $_FILES;

      // Recorrer con ciclo for
      for($i = 0; $i < count($items1); $i++) {
          // Usar el mismo índice para acceder a todos los elementos
          $item1 = $items1[$i];
          $item2 = $items2[$i];
          $item3 = $items3[$i];
          $item4 = $items4[$i];

          // Asignar el archivo actual a $_FILES
          $_FILES['ingreso']['name'] = $files['ingreso']['name'][$i];
          $_FILES['ingreso']['type'] = $files['ingreso']['type'][$i];
          $_FILES['ingreso']['tmp_name'] = $files['ingreso']['tmp_name'][$i];
          $_FILES['ingreso']['error'] = $files['ingreso']['error'][$i];
          $_FILES['ingreso']['size'] = $files['ingreso']['size'][$i];    

          // Continúas con la ejecución normal

          $rand = rand(1,1000000);
          // Puedes incluir variables en cadenas si están entre comillas dobles
          // Usar el índice para agregar a la cadena
          $nombre = "ingresoFamiliarN°$dni-$fecha-$rand-" . ($i + 1);

          //POR CADA ITERACION CARGA EN LA BASE DE DATOS EL GRUPO FAMILIAR.
          $this->cargar_archivosgrupofamiliar($item1, $item2, $item3, $item4, 'ingreso', $nombre);
5
  • Tengo una duda...
    – gisela
    Commented el 21 may. 2021 a las 20:54
  • 'ingreso'. Ahi que pasarias en la function cargar_archivosgrupofamiliar.
    – gisela
    Commented el 21 may. 2021 a las 20:55
  • No entiendo muy bien esa parte.
    – gisela
    Commented el 21 may. 2021 a las 20:55
  • Ahí edite la pregunte y agregue la funcion
    – gisela
    Commented el 21 may. 2021 a las 20:57
  • probe y funciono amigo. Igualmente no logro entender para que me sirve los $_FILES
    – gisela
    Commented el 21 may. 2021 a las 21:08
0

se me ocurre que uses una clase para tus tr class='recorrer' y cuando elimines una fila mandes llamar una funcion que recorra y actualice el atributo id

function corregir(){
  anterio=0;

 $(".recorrer").each(function () {
            let id = $(this).attr("id");
            id=id.replace('row','');
            id=parseInt(id);
            let comprobar=id-1;
            if(anterior==comprobar){
                anterior+=1;
            }else{
                $(this).attr("id",comprobar);
            }
            
        });
}

de esa manera no importa las filas que tengas ni cual elimines

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.