how can I navigate in an html table using jquery parent?

Question

how can I navigate in an html table using jquery parent?

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I have a problem that was recently presented to me. I need the value of a input found in a table in the second row when I press a button that is in the third row, using jquery and parent .

I show you an example:

<table>
<tbody>
    <tr>
        <td>
            Servicio
        </td>
    </tr>
    <tr>
        <td>
            <input type="hidden" value="">
        </td>

    </tr>
    <tr>
        <td>
            <input type="button" value="Atendido" id="atendido">

        </td>
    </tr>
</tbody>

What I have so far is:

$(document).on("click", "#atendido", function(e){
    var aux;
    aux=$(this).parent().parent().parent();
    alert(aux);
});

but I still do not know how to get to input to get the value of it, I got stuck.

Thanks for your help.

javascript jquery html5 html

asked by Alvaro vargas astorga 31.01.2018 в 16:19

source

2 answers

0

$(document).on("click", "#atendido", function(e){
    var aux;
    //2 parent() para ir hasta el tr | prev() para ir a la fila anterior | y find para buscar el input
    aux=$(this).parent().parent().prev().find("input").val();
    alert(aux);
});

answered by 31.01.2018 в 16:35

JQUERY + Apache Cordova Querq mysql html

score 0 · Accepted Answer

The way you can access the input you want is the following, I do not know if the structure you have is mandatory but you could restructure it to make it easier.

$("#atendido").on("click", function(e) {
  var valor = $(this).closest("tr").prev().find("input").val();
  console.log(valor);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>Servicio</td>
    </tr>
    <tr>
      <td><input type="hidden" value="valor"></td>
    </tr>
    <tr>
      <td><input type="button" value="Atendido" id="atendido"></td>
    </tr>
  </tbody>
</table>