1

Necesito que cuando se inserte una fila en la tabla poder capturar ese evento para poder calcular el total de edades y en el caso que se eliminen filas restar las edades gracias.

he intentado usar un onchange y un update sin resultados:

$("#table_datos").on("change", function() {
        alert("cambio detectado");
    });

    $('#table_datos').on('update', function(){
        alert("cambio detectado");
    });


    <table id="table_datos">
          <thead>
            <tr id="1">
              <th>Nombre</th>
              <th>Edad</th>
            </tr>
          </thead>

          <tbody>
            <tr id="2">
              <td>Jorge</td>
              <td>18</td>
            </tr>
            <tr>
              <td>Juan</td>
              <td>21</td>
            </tr>
          </tbody>
        </table>

    $('#table_datos').append('<tr id='+token+'><td>'+variable1+'</td><td >'+variable2+'</td><td><button  type="button" onclick="Eliminar('+token+');"> Eliminar </button></td></tr>')


    function Eliminar(token){

     $('#'+token).remove();

    }
3
  • @Randall Me parece que el código no se está ejecutando bien. Podría ser que no está completo para ser ejecutado ¿Podrías revisar si se puede ejecutar? Si no fuera así, habría que quitar Stack Snippet.
    – Rubén
    el 12 jul. 2017 a las 21:56
  • si ya lo quite gracias ! el 12 jul. 2017 a las 21:57
  • Un editor tiene una ventana de 5 minutos para hacer cambios a su revisión sin crear una nueva revisión. Me parece que uno debería esperar un poco antes de deshacer un edición y que sería aún mejor dejarle un comentario al editor sobre lo que no nos gustó o que le faltó a la edición.
    – Rubén
    el 12 jul. 2017 a las 21:59

1 respuesta 1

0

Crea un evento que detecte el cambio puedes hacerlo de dos formas:

$('#table_datos tbody').on('change', function() {
  console.log("hola")
})

o bien de esta otra forma:

$('#table_datos tbody').change(function() {
  console.log("hola")
})

pero parece haber un problema, no se detecta cambio alguno solo con ese evento creado.

para llamar al evento tendríamos que hacer que se ejecute dicho evento, tambien hay dos formas:

$('#table_datos').change();

o bien

$('#table_datos').trigger('change');

var token = 3;
var variable1 = "JuankGlezz";
var variable2 = 25;

$(function() {
  $('#table_datos').append('<tr id=' + token + '><td>' + variable1 + '</td><td >' + variable2 + '</td><td><button  type="button" onclick="Eliminar(' + token + ');"> Eliminar </button></td></tr>')

  $('#table_datos').on('change', function() {
    console.log("hola")
  })
  //llamando al cambio por .trigger() debido al .append()
  $('#table_datos').trigger('change')
});


function Eliminar(token) {
  $('#' + token).remove();
  //llamando al evento de cambio con .change() debido a la eliminacion del dato
  $('#table_datos').change()
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table id="table_datos">
  <thead>
    <tr id="1">
      <th>Nombre</th>
      <th>Edad</th>
    </tr>
  </thead>

  <tbody>
    <tr id="2">
      <td>Jorge</td>
      <td>18</td>
    </tr>
    <tr>
      <td>Juan</td>
      <td>21</td>
    </tr>
  </tbody>
</table>

2
  • una consulta, viendo tu código, veo que funciona perfectamente,cuando llamas al trigger no usas el id de la tabla ? el 12 jul. 2017 a las 22:17
  • @JavierAntonioAguayoAguilar En el ejemplo no lo uso debido a que solo es una tabla, pero si solo quieres afectar a esa en especifico puedes usarlo, solo recuerda que los id´s deben ser únicos, igual edito el ejemplo para usar los id
    – JuankGlezz
    el 12 jul. 2017 a las 22:26

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.