Quiero obtener una entrada con el end de la clase cuando se cambia el valor del start de la clase.
También puedo tener más de 1 end y start de clase.
<tr class="input-proporsional"> <td>1. Start -</td> <td> <input type="text" name="start[]" class="form-control start" style="width: 60px"> // when the value is changed </td> <td>End -</td> <td> <input type="text" name="end[]" class="form-control end" style="width: 60px"> // get this input </td> <td>Rate</td> <td><input type="text" name="rate[]" class="form-control rate" style="width: 90px"></td> </tr> <tr class="input-proporsional"> <td>2. Start -</td> <td> <input type="text" name="start[]" class="form-control start" style="width: 60px"> </td> <td>End -</td> <td> <input type="text" name="end[]" class="form-control end" style="width: 60px"> </td> <td>Rate</td> <td><input type="text" name="rate[]" class="form-control rate" style="width: 90px"></td> </tr>Hasta ahora, he intentado algo como el siguiente código:
$(".start").on("change", function() { let element = $(this).parent().parent().find('td').children('end').html(); console.log(element); } Pero aún no funciona, regresa undefined a la consola. Y si escribo mi código así (hasta tr padre):
console.log($(this).parent().parent().html());El resultado es así (obtuve todos los td):
<td>1. Start -</td> <td><input type="text" name="start[]" class="form-control start" style="width: 60px"></td> <t>End -</td> <td><input type="text" name="end[]" class="form-control end" style="width: 60px"></td> <td>Rate</td> <td><input type="text" name="rate[]" class="form-control rate" style="width: 90px"></td>tendrás que usar .closest()
$(".start").on("change", function() { let element = $(this).closest('tr').find('.end').html(); console.log(element); }O puede usar parents como:
$(".start").on("change", function() { let element = $(this).parents("tr").find(".end"); console.log(element) });