javascript – Get sibling id of the item that triggered the event

Question:

I have a table and inside das <td> I have two input:

<input id="CdProduto" value="15" hidden>
<input type="number" value="2" class="form-control">

I need when I change the value of the input number it returns the value of the CdProduto input .

Remembering that this link will be repeated according to the quantity of product.

    $(":input").bind('keyup mouseup', function () {
        alert("changed");
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
                            <thead>
                            <tr>
                                <th colspan="2">Produto</th>
                                <th>Quantidade</th>
                                <th>Valor unitário</th>
                                <th>Desconto</th>
                                <th colspan="2">Sub Total</th>
                            </tr>
                            </thead>
                            <tbody>
                                    <tr>
                                        <td>
                                            <a href="#">
                                                <img alt="White Blouse Armani">
                                            </a>
                                        </td>
                                        <td><a href="/produtos/2">Pao</a>
                                        </td>
                                        <td>
                                            <input id="CdProduto" value="2" hidden>
                                            <input type="number" value="1" class="form-control">
                                        </td>
                                        <td>R$ 1,00</td>
                                        <td>R$ 0,00</td>
                                        <td>R$ 1,00</td>
                                        <td><a href="#"><i class="fa fa-trash-o"></i></a>
                                        </td>
                                    </tr>
                            </tbody>
                            <tfoot>
                            <tr>
                                <th colspan="5">Total</th>
                                <th colspan="2">R$ 1,00</th>
                            </tr>
                            </tfoot>
                        </table>

How am I going to do this?

Answer:

Use siblings :

$(":input").bind('keyup mouseup', function () {
    $(this).siblings(':hidden').val();
})

Another detail is that you have to use type=hidden instead of hidden .

<input id="CdProduto" value="15" type="hidden" />
<input type="number" value="2" class="form-control" />
Scroll to Top