0

Tengo la siguiente tabla:introducir la descripción de la imagen aquí

la cual se genera inmediatamente, pero al realizar un cambio de fechas con

 $("#p-fechaIni").change(function() {

          tablaP($("#p-fechaIni").val(), $("#p-fechaFin").val());

        });

manda los datos y hace un nuevo JSON con nuevos datos y me crea otra tabla pero debajo de la misma:

introducir la descripción de la imagen aquí

La pregunta aquí es como puedo eliminar la tabla que esta creada al hacer el cambio de fechas y me crea la nueva tabla con los nuevos datos, que no la ponga debajo de la otra tabla, si no que sea solo una. intente hacerlo con la función remove():

$("#p-fechaIni").change(function() {
   $("#tablaDatos").remove();
   tablaP($("#p-fechaIni").val(), $("#p-fechaFin").val());

}); 

HTML

<table id="tablaDatos" class="table table-striper table-bordered table-hover">
</table> 


function tablaP(datoFechaI, datoFechaF){
        peticionDatos(
          '<?= base_url(); ?>index.php/ejemplo/usuario/datos',
            {},
            function(){},
            function(datos){
              //$("#tablaDatos").remove();
                var strtabla = "<thead><tr><td colspan='2'>Lugar</td>";
                var strDiv = "</tr><tr><td>Usuario</td><td>Rol</td>";
                var cont=0;

                $(datos).each(function(i,e){



                    strtabla += "<td colspan='2'id='c-"+e.id+"' data-lugar='"+(e.id)+"'>"+e.nombre+"</td>";
                    cont++;

                    strDiv += "<td  id='c-"+e.id+"' data-lugar='"+(e.id)+"'>Nº A.</td><td  id='c-"+e.id+"' data-lugar='"+(e.id)+"'>Saldo</td>";


                });

                strtabla += strDiv+"</tr></thead>";
                $("#tablaDatos").append(strtabla);
                cargaNum(cont, datoFechaI, datoFechaF); // esta funcion es para crear el body de la tabla con otros datos al igual que el thead se crea con la funcion append dependiendo los datos.
        });
      }

a lo cual me borra la tabla pero no crea la nueva... alguien que me pueda ayudar ¿?

2
  • es posible que al refrescar la tabla, los nuevos datos se estén agregando dentro de #tablaDatos, por lo tanto si lo borrar ya no se cargan. La solución podría ser borrar algún elemento interno, no el #tablaDatos. Para resolver tu duda parece importante conocer la estructura de tu html, así como la implementación del método tablaP
    – spuente
    el 21 ago. 2017 a las 16:40
  • @spuente,agregué como creo el thead de mi tabla, no puse el body por que es mas pero se crea de la misma manera con la función append y dependiendo los datos
    – Soldier
    el 21 ago. 2017 a las 17:01

1 respuesta 1

2

Prueba cambiar el $("#tablaDatos").remove(); por $("#tablaDatos").html(""); lo que pasa es que el $("#tablaDatos").remove(); elimina la tabla por completo y cuando tratas de agregar la nueva ese elemento ya no existe por eso no lo crea con $("#tablaDatos").html(""); lo que se hace es cambiar el contenido html interno del elemento table por "" lo que lo deja vacio y listo para el nuevo contenido.Espero te ayude.

tambien puedes usar $("#tablaDatos").empty(); logrando el mismo resultado.

3
  • 1
    $("#tablaDatos").empty() elimina todo el contenido del elemento
    – Byron
    el 21 ago. 2017 a las 20:26
  • si es verdad tienes razon gracias!!
    – jhbosch
    el 21 ago. 2017 a las 20:33
  • Gracias @user2755565 ya había encontrado la solución que de echo es la misma que tu me estas dando jajaa, aun así muchas gracias.
    – Soldier
    el 22 ago. 2017 a las 16:23

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.