Comment sélectionner un champ de saisie dans le prochain TD avec Jquery?

Question

Je veux sélectionner un champ de saisie dans TD suivant avec Jquery. Je ne peux pas utiliser d'ID ou de classe car la ligne de la table peut être ajoutée ou supprimée.

comme,

<tr> 
<td><input type='text' name='price[]' onkeyup = 'getTest(this)' /> </td> 
<td><input type='text' name='qty[]' onkeyup = 'getPrice(this)' value='1' /> </td> 
<td><input type='text' name='amount[]' /> </td> 
</tr> 

function getTest(obj){ 
//I want to select qty[] and amount[] 
} 

function getPrice(obj){ 
//I want to select price[] and amount[] 
} 

quelqu'un sait comment sélectionner les champs d'entrée, s'il vous plaît aider ~!

Merci

Answer 1

working demo de votre comportement attendu de votre page Web.

Answer 2

La réponse de Chinmayee est beaucoup mieux que celui-ci, mais si vous ne voulez pas modifier l'une de votre marge HTML, vous pouvez simplement laisser tomber ceci dans votre JavaScript et il fonctionnera:

function getTest(obj) { 
     var tr = $(obj).closest('tr'); 
     var qty = tr.find('input[name="qty[]"]'); 
     var amount = tr.find('input[name="amount[]"]'); 

     console.log('qty: ' + qty.val()); 
     console.log('amount: ' + amount.val()); 

    } 

    function getPrice(obj) { 
     var tr = $(obj).closest('tr'); 
     var price = tr.find('input[name="price[]"]'); 
     var amount = tr.find('input[name="amount[]"]'); 

     console.log('price: ' + price.val()); 
     console.log('amount: ' + amount.val()); 
    } 

Mais la raison pour laquelle la réponse de Chinmayee est meilleure que la mienne est parce qu'elle utilise un JavaScript discret, et elle utilise également la délégation d'événements, donc elle fonctionnera mieux.

Answer 3

est ici une solution possible pour votre problème (en supposant que vous voulez montant être prix * qté):

$(document).ready(function(){ 
    $('[name="price[]"], [name="qty[]"]').live('keyup', function(){ 
    var inputs = $(this).closest('tr').find('input'); 
    $(inputs[2]).val($(inputs[0]).val()*$(inputs[1]).val()); 
    }); 
}); 

Votre méthodes getTest() et getPrice() ne sont plus nécessaires avec cette solution et vous pouvez également supprimer les attributs onkeyup="..." sur les éléments input.

See here pour une démo de travail.