Discussion :

[kasoutami]

Bonjour tout le monde,


J'ai un petit soucis avec l'utilisation de next(), je vous explique:

Voici mon code HTML:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<form action="index.php?page=trade]" method="POST">
 
    Quantité: <input type="text" class="nb_vsx" name="nb_unite" 
                     value="XXX" />
 
    <input type="hidden" name="flt_action_buy" value="XXX" />
    <input type="hidden" class="price_unt" value="XXX"/>				
    <input type="submit" value="Annuler la vente"/>
 
</form>

Ce que je voulais faire: quand l'utilisateur termine de rentrer un nombre dans l'input qui a pour class "nb_vsx", on aille chercher la valeur du champs caché qui a pour class "price_unt".

Sachant que ce bout de code se répète en boucle X fois dans la page.

J'ai commencé à écrire:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
$('.nb_vsx').live("keyup", function(){
 
 
	//on récupère la valeur du champs (price_unt) qui suit
	var price = $(this).next(".price_unt").val();
 
        alert(price);
});

Le soucis, c'est que l'alert me sort: "Undefinited".

Je ne sais pas ou ça coince, peut ètre me suis-je trompé sur le fonctionnement de next().

Quelqu'un aurait une idée pour m'aider ?

Merci d'avance,


kasou

[_concept_]

Il me semble que next() c'est pour l'élément qui suit juste après, quel qu'il soit. Le selecteur sert alors juste à déterminer la nature de cet élément.

Essaye ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var price = $(this).nextAll(".price_unt:eq(0)").val();

Ici on considère toutes les classes ".price_unt" et on traite la première d'entre elles grâce au eq() (enfin en théorie...).

[kasoutami]

Salut _concept_ , merci pour ta réponse, mais il me dit toujours que price n'est pas défini

[Quatre_Couleurs]

Jouer avec next n'est pas très robuste, à la moindre modification de ton HTML, ton Javascript ne fonctionnera plus. Donne plutôt des id à tes éléments...

[SpaceFrog]

.find() ?

[Watilin]

var price = $(this).nextAll(".price_unt:eq(0)").val();

.nextAll() sélectionne tous les nœuds suivants, puis applique le filtre. Ici, :eq(0) correspond au flt_action_buy, ce qui, intersecté avec .price_unt donne un résultat vide.

Il suffit de faire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var price = $(this).nextAll(".price_unt").val();

[danielhagnoul]

Bonsoir

Il me semble que next() c'est pour l'élément qui suit juste après, quel qu'il soit. Le selecteur sert alors juste à déterminer la nature de cet élément.

Essaye ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var price = $(this).nextAll(".price_unt:eq(0)").val();

Ici on considère toutes les classes ".price_unt" et on traite la première d'entre elles grâce au eq() (enfin en théorie...).

Même si kasoutami n'a pas réussi à la mettre en oeuvre, la solution et le code donné par _concept_ est tout a fait correct (j'ai testé pour en être certain).

En l'adaptant à l'insertion d'une division :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var price = $(this).next().children(".price_unt:eq(0)").val();

ou

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var price = $(this).next().children(".price_unt:first").val();

On sélectionne l'élément suivant (div) puis dans ses fils (children), tous les éléments (nextAll) ayant la classe ".price_unt". Mais on ne retient que le premier d'une éventuelle série.

La critique et l'explication de Watilin,

Ici, :eq(0) correspond au flt_action_buy

, est erronée.

[Watilin]

@Dany
Autant pour moi alors, j’ai dû encore confondre le sélécteur :eq(0) (ou :first comme tu le fais remarquer) avec la méthode .first(). C’est bien :first qui repère la position dans le DOM et .first() dans la collection de nœuds renvoyée, et pas le contraire.

Mais alors, pourquoi la solution de _concept_ ne marchait pas ?

[danielhagnoul]

Bonsoir.

Tout le monde peut commettre une erreur, moi le premier.

Mais il est toujours bon et bien de rendre à César ce qui appartient à Jules.

Avec Firefox et Firebug, si je fais :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
$(function(){
	console.log($("div"));
	console.log($("div").first());
	console.log($("div:first"));
});

Je sélectionne toujours la première division qui, avec Firebug, est div#_firebugConsole

Mais alors, pourquoi la solution de _concept_ ne marchait pas ?

Seul kasoutami peut répondre à votre question, mais il toujours possible que le code de sa question et son code réel aient été légèrement différents.