Buscar campos de entrada en la fila de la tabla actual con la clase

Question

Estoy haciendo una librería y quiero agregar un elegante formulario de pedido de jQuery. El punto es que el usuario debe elegir la cantidad de un libro con un botón menos y más y luego dejar que JavaScript calcule una suma total para ese libro.

que tienen un margen de beneficio de la siguiente manera:

<tr> 
    <td><p>Book title</p></td> 
    <td><p><a href="#" class="bookDecrement">-</a><input type="text" class="bookQuantity disabled" disabled /><a href="#" class="bookIncrement">+</a></p></td> 
    <td><p><input type="text" class="bookPrice disabled" value="70" disabled /></p></td> 
    <td><p>=</p></td> 
    <td><p><input type="text" class="bookTotal disabled" disabled /></p></td> 
    </tr> 

¿Cómo llego a la clase BookPrice y bookTotal en esta fila con jQuery? Como tengo varios títulos de libros, solo necesito acceder a la entrada archivada en la fila actual.

Gracias!

Answer 1

Esto debe hacerlo:

$('.bookDecrement, .bookIncrement').click(function() { 

    // Get the current row 
    var row = $(this).closest('tr'); 

    // Determine if we're adding or removing 
    var increment = $(this).hasClass('bookDecrement') ? -1 : 1; 

    // Get the current quantity 
    var quantity = parseInt(row.find('.bookQuantity').val(), 10); 
    // Adjust the quantity 
    quantity += increment; 
    // Quantity must be at least 0 
    quantity = quantity < 0 ? 0 : quantity; 

    // Get the price 
    var price = parseFloat(row.find('.bookPrice').val()); 

    // Adjust the total 
    row.find('.bookTotal').val(quantity * price); 

    // Return false to prevent the link from redirecting to '#' 
    return false; 
}); 

Answer 2

Se puede llegar a la tr ancestro y descender de nuevo a la entrada en su interior. De esta manera:

$("a.bookIncrement").click(function() { 
    $(this).closest("tr").find("input.bookPrice").doSomething(); 
});