À l'aide d'un nom de classe dans jQuery .plus proche (le)
Je suis d'essayer de faire quelques calculs pour un "total", c'est mon code:
$('.quantity_input').live('change',function(){
var ValOne = parseFloat($(this).val());
var ValTwo = parseFloat($(".price").text())
var totalTotal = ((ValOne) * (ValTwo));
$('.cost_of_items').closest('.cost_of_items').text(totalTotal.toFixed(2));
calcTotal();
});
.quantity_input est une entrée, .le prix est le prix du produit, .cost_of_items est l'endroit où je veux mettre à jour le coût total pour l'article, c'est à dire. item1 = £5 x 3 quantité = £15 total pour item1
calcTotal() est une fonction qui met à jour un coût total de la commande. Le problème est de garder toutes les mathématiques dans une ligne de la table, c'est à dire que je suis en train de faire le calc dans le code ci-dessus et sa ne colle pas à sa ligne, sa mise à jour tous les champs de la classe .cost_of_items etc...
le problème avec la montre mon code html, c'est que sa dynamique ajouté par jQuery .ajoute (), mais ici est le jQuery:
$('#items').append('<tr class="tableRow"><td><a class="removeItem" href="#"><img src="/admin/images/delete.png"></img></a><td class="om_part_no">' + omPartNo + '</td><td>' + supPartNo + '</td><td>' + cat + '</td><td class="description">' + desc + '</td><td>' + manuf + '</td><td>' + list + '</td><td>' + disc + '</td><td><p class="add_edit">Add/Edit</p><input type="text" class="quantity_input" name="quantity_input" /></td><td class="price_each_nett price">' + priceEach + '</td><td class="cost_of_items"></td><td><p class="add_edit">Add/Edit</p><input type="text" class="project_ref_input" name="project_ref_input" /><p class="project_ref"></p></td></tr>');
EDIT:
Solution de travail:
$('.quantity_input').live('change',function(){
var ValOne = parseFloat($(this).val());
var ValTwo = parseFloat($(this).closest('tr').find('.price').text())
var totalTotal = ((ValOne) * (ValTwo));
$(this).closest('tr').find('.cost_of_items').text(totalTotal.toFixed(2));
calcTotal();
});
- La ligne ici, qui ressemble de mal, c'est
$('.cost_of_items').closest('.cost_of_items')
. Pourriez-vous nous montrer votre HTML ainsi? - Tous les parenthèses ((ValOne) * (ValTwo)) ne font absolument rien.
- Il vous manque une fermeture
</td>
balise dans votre.append()
.
Vous devez vous connecter pour publier un commentaire.
Vous devez trouver le
.cost_of_items
dans le<tr>
contenantthis
:La plus proche la plus proche se trouve ancêtre (parent, grand-parent), mais vous devrez alors faire une recherche afin de trouver le bon élément pour la mise à jour. Par exemple, si vous avez un élément dans une ligne du tableau et vous avez besoin d'un autre élément dans cette même ligne:
Edit:
Dans votre cas, vous souhaitez
Je ne voudrais pas utiliser
.find()
. J'imagine qu'il sera probablement un peu plus efficace à parcourir jusqu'à la plus proche<td>
et obtenir le frère<td>
avec le.cost_of_items
classe à l'aide de jQuery.les frères et sœurs()
méthode.EDIT: Pour clarifier, voici le balisage de la
.append()
:<td class="cost_of_items"></td>
.Vous n'avez pas besoin d'utiliser le trouver.
proche
prend un argument contexte. qui vous aide à cerner le domaine de recherche. Vous devriez l'utiliser..cost_of_items
n'est pas un ancêtre de.quantity_input
, une autre méthode est toujours nécessaire, comme.find()
..cost_of_items
élément par rapport à ce point de départ. Rien de mal à traverser l'un à l'autre..closest()
ou son contexte paramètre fonctionne. Le.closest()
méthode que regarde ancêtres. Parce que l'élément ciblé n'est pas un ancêtre dethis
,.closest()
ne le trouverez pas. Tout le contexte n'est de limiter les ancêtres de ceux dans le contexte.