Récupérer la valeur d'une div en jQuery

[MeTaLLiQuE]

Bonjour,

Le titre du sujet fait un peu "noob" mais mon problème est plus complexe que cela.

Sur le jeu que je suis actuellement en train de développer je rencontre un problème. Je fais une gestion en AJAX d'un module (Le module des traités)

Lorsque le joueur reçoit une demande de traité, ce dernier a deux possibilités : Accepter ou Refuser le traité.

Lorsque le traité est Refusé, je supprime simplement en jQuery la ligne et basta.

Par contre, lorsque le joueur accepte le traité je veux que le contenu des différentes divs soient déplacé dans d'autres divs. (Je ne sais pas si vous avez compris, j'ai un peu du mal à être plus explicite).

Par exemple:

<div id="tbDiplo3">



<div id="trDiplo1Body"><a href="#">PSEUDO</a></div>

<div id="trDiplo2Body">TYPE TRAITE</div>

<div id="trDiplo3Body">En cours...</div>

<div id="trDiplo4Body"><a href="#" onClick="FONCTION JS">Accepter</a> / <a href="#" onClick="FONCTION JS">Refuser</a></div>

</div>

Lorsque je clique sur Accepter ma fonction JS le détecte et je veux que dans cette même fonction il me déplace PSEUDO; TYPE TRAITE et le LIEN vers d'autres divs complètement différent.

<div id="tbDiplo9">



<div id="trDiplo9Body"><a href="#">PSEUDO</a></div>

<div id="trDiplo10Body">NOM TRAITE</div>

<div id="trDiplo11Body"><a href="#" onClick="FONCTION JS>Annuler</a></div>

</div>

Le code JS

function gestionDiplomatie(id, option)

{

$("#diplomatie").on('click', 'div > a', function(){

if(option == 'accepter')

{

var test = $(this).parent();

console.log($(test > "#trDiplo1Body").text());

var traite = '<div id="tbDiplo9">'

+ '<div id="trDiplo9Body"><a href="#">PSEUDO</a></div>'

+ '<div id="trDiplo10Body">TRAITE</div>'

+ '<div id="trDiplo11Body"><a href="#">Annuler</a></div>'

+ '</div>';



$(traite).insertAfter("#tbDiplo8");

}



// Permet de supprimer toute la div tbDiplo3

$(this).parent().parent().remove(); 

});

}

N'hésitez pas à me poser vos questions, si vous n'avez pas compris.


Merci d'avance, 

Cordialement,

[niahoo]

quand tu fais $(test > "#trDiplo1Body"), test est une variable contenant un objet jQuery renvoyé par $(this).parent(), > est l'opérateur "plus grand que" et "#trDiplo1Body" est une chaine de caractère.

test > "#trDiplo1Body" renvoie donc un booléen (est-ce que test node est plus grand que telle chaine), ce qui renvoie probablement false.

$(test > "#trDiplo1Body") correspond donc à $(false) ... ce qui n'a aucun sens.

Bref, ça c'est pour ton console.log. Ensuite j'ai l'impression que tu ne nous dis pas ce qui ne fonctionne pas. Mais je crois que tu devrais juste déplacer ton div : $(this).parent().insertAfter($('#tbDiplo8').

[MeTaLLiQuE]

Salut,

En faite, je ne veux pas déplacer la div complète, car comme tu as pu le remarquer les deux divs (voir code HTML) sont complètements différentes, elles ne possèdent pas les mêmes noms, les mêmes nombres de lignes etc. ...

Ce que je veux, c'est récupérer les valeurs de chaque div (dans le premier code HTML) pour les transférer dans d'autres divs (voir code HTML 2).

Cordialement,

[Xenos]

Salut,

je ne sais pas si c'est déjà le cas, mais place ton code JS dans un fichier séparé: les chevrons (> et <) ont tendance à mettre un peu le bazar si le JS est encapsulé dans une balise <script> plutôt que dans un fichier dédié.


Je partirai sur:

Code :

var div = $("#trDiplo1Body"); // Caching variable

// Si nécessaire (je ne sais plus si jQuery le fait tout seul puisqu'un DOMNode ne peut pas être à deux endroits à la fois)
div.parent().removeChild(div);

$("#trDiplo9Body").empty().appendChild(div);

N'hésite pas à lire la doc jQuery pour y trouver quelques fonctions utiles: http://api.jquery.com/empty/ (je n'ai pas trouvé de "replace" concluant, mais cela existe peut-être).

Code :

var traite = '<div id="tbDiplo9">'
+ '<div id="trDiplo9Body"><a href="#">PSEUDO</a></div>'
+ '<div id="trDiplo10Body">TRAITE</div>'
+ '<div id="trDiplo11Body"><a href="#">Annuler</a></div>'
+ '</div>';

Attention aux injections XSS si tu comptes remplacer les PSEUDO, TRAITE, etc par des valeurs issues de variables.


PS: "trDiploXBody": à mon avis, c'est pas la meilleure nomenclature. Je lui préfèrerai un "class='tr diplomatie body'" + un data-* attribute "data-index='X'", ce qui permet de sélectionner un élément précis (.tr.diplomatie.body[data-index="9"]) ou de les sélectionner tous (.tr.diplomatie.body).

[niahoo]

Salut,

En faite, je ne veux pas déplacer la div complète, car comme tu as pu le remarquer les deux divs (voir code HTML) sont complètements différentes, elles ne possèdent pas les mêmes noms, les mêmes nombres de lignes etc. ...

Ce que je veux, c'est récupérer les valeurs de chaque div (dans le premier code HTML) pour les transférer dans d'autres divs (voir code HTML 2).

Cordialement,

Bah tu peux changer les attributs aussi ...

[MeTaLLiQuE]

Salut,

Merci, je vais essayer ça !

Cordialement,