Variable PHP dans une fonction Javascript

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Variable PHP dans une fonction Javascript

kontas

Photographe amateur daltonien

Salut à tous.

Je vais essayer d'expliqué simplement mon "problème".

J'ai une boucle PHP qui me créer un formulaire pour chaque enregistrement Mysql.

Quand je modifie un des <select> de ce formulaire, j'ai une fonction sur l'évenement Onclick qui me recalcul le prix. ce calcul fonctionne parfaitement, il ni y'a aucun souci.

Seulement, le résultat de ce calcul doit être renvoyé à la div du formulaire correspondant, et c'est la ou je coinse, car je n'ai pas de problème pour cibler une div pour le renvoit, mais par contre je ne sais pas comment ciblé une DIV qui n'est pas déclaré physiquement

Voici mon script:

Code :

function prix_bapteme(tours,passager,option,id_circuit){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
//alert(xhr.readyState);
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
di = document.getElementById('prix_bapteme');
di.innerHTML = xhr.responseText;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","./prix_bapteme.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, On defini ce qu'on récupere et comment
data="tours="+escape(tours)+"&passager="+escape(passager)+"&option="+escape(option)+"&id_circuit="+escape(id_circuit);
//alert(idauteur);
xhr.send(data);
}

Je m'étais imaginé, déclarer la valeur DIV dans la fonction, puis récuperer cette valeur dans la ligne qui cible le résultat ->>di = document.getElementById('prix_bapteme');

Mon problème c'est que je ne sais pas du tout comment récuperer cette valeur dans la fonction document.getElementById()

J'espère avoir été assez clair.

Peut être que vous comprendrez mieux directement sur la page en question: http://bapteme-drift.com/rocks/ind [...] ement&id=2

Merci beaucoup pour votre aide

Publicité

GordonF_69

prix=document.getElementById('MaDivAvecLePrix').innerHTML

pour virer le signe € a la fin et faire des calcul

prix=parseInt(prix)

Message cité 1 fois

GordonF_69

Attention, dans ton code, les 3 DIV on le meme ID, ca va foirer !

puis dans ta DIV ta un span, tu va devoir jouer avec les element DOM (children ...)

Message cité 1 fois
Message édité par GordonF_69 le 28-03-2011 à 11:39:05

kontas

Photographe amateur daltonien

GordonF_69 a écrit :

prix=document.getElementById('MaDivAvecLePrix').innerHTML

pour virer le signe € a la fin et faire des calcul

prix=parseInt(prix)

Pourquoi remplacer di = document....... par prix = document...... ??

De la manière que tu l'indique je peu faire ca ?!

Ajouter la valeur de la div dans l'envoie de ma fonction:

Code :

<select name='option' id='option' onchange="prix_bapteme(<?php echo $id_voiture; ?>,tours.value,passager.value,option.value,<?php echo $idCircuit; ?> )">

Ajouter le paramêtre dans la déclaration de ma fonction:

Code :

function prix_bapteme(MaDivAvecLePrix,tours,passager,option,id_circuit){
.......
.......
.......
.......
if(xhr.readyState == 4 && xhr.status == 200){
di = document.getElementById('MaDivAvecLePrix').innerHTML;
di.innerHTML = xhr.responseText;
}
}

GordonF_69 a écrit :

Attention, dans ton code, les 3 DIV on le meme ID, ca va foirer !

puis dans ta DIV ta un span, tu va devoir jouer avec les element DOM (children ...)

Oui actuellement je n'ai pas encore créer la boucle qui me générera les formulaires, je l'ai créée manuellement pour observer le comportement de la fonction en premier lieu

Message édité par kontas le 28-03-2011 à 12:11:25

knoodrake

je sui Liiiiiibre

Bé voui, c'est exactement comme tu le dit toi-même.. !
Exemple (mais il n'y à pas qu'une manière de faire):

1- Comme l'a très justement dit GordonF_69, tu à des DIVs avec les mêmes IDs. Déjà, change ça, c'est impératif. un ID en xml, c'est unique !
Imaginons donc que tu à renommé tes IDs pour avoir 2 zones de prix avec des ID différents, disons id="prix_bapteme_voiture_1", id="prix_bapteme_voiture_2".

2- Dans ton onchange, tu passe la div à mettre à jour. Ex: onchange="prix_bapteme(<?php echo $id_voiture; ?>, [...] etc...);"

3- Dans ton javascript:

Code :

function prix_bapteme(id_voiture,tours,passager,option,id_circuit){
.....
.....
di = document.getElementById('prix_bapteme_voiture_' + id_voiture ).innerHTML;
.....
.....
}

---------------
mes Photos!

knoodrake

je sui Liiiiiibre

J'avais pas fait gaffe au span. du coup, soit ton PHP renvoi le SPAN tout fait, soit, comme tu à jQuery, c'est très simple.
D'ailleurs, j'avais fait une gaffe. c'est pas
di = document.getElementById('prix_bapteme_voiture_' + id_voiture ).innerHTML;
mais
di = document.getElementById('prix_bapteme_voiture_' + id_voiture );

Et donc pour l'hisoire du SPAN, au lieu de:

Code :

di = document.getElementById('prix_bapteme_voiture_' + id_voiture );
di.innerHTML = xhr.responseText;

et bien par exemple:

Code :

// '#prix_bapteme_voiture_' + id_voiture +' > .prix' ca veut l'élément de class=prix enfant de prix_bapteme_x
// $() c'est le document.getElementById (et plus encore) de jQuery
// ..qui renvoi un tableau, donc on prend le premier => [0]
// et enfin, .html() c'est le innerHTML de jQuery
$('#prix_bapteme_voiture_' + id_voiture +' > .prix')[0].html(xhr.responseText);

Après faudra aussi modifier la balise <a> juste en dessous du span, puisque son onClick à l'air de renvoyer le prix.

Message cité 1 fois

---------------
mes Photos!

kontas

Photographe amateur daltonien

Voila ce que j'ai fait:

Récupération de la valeur de la div dans la déclaration de la fonction

Code :

function prix_bapteme(tours,passager,option,id_circuit,id_evenement,numDiv){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
//alert(xhr.readyState);
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
di = document.getElementById('numDiv').innerHTML;
di.innerHTML = xhr.responseText;
}
if(xhr.readyState == 1){
alert('attente du serveur');
}
}
// Ici on va voir comment faire du post
xhr.open("POST","./prix_bapteme.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, On defini ce qu'on récupere et comment
data="tours="+escape(tours)+"&passager="+escape(passager)+"&option="+escape(option)+"&id_circuit="+escape(id_circuit)+"&id_evenement="+escape(id_evenement);
//alert(idauteur);
xhr.send(data);
}

Déclaration de la valeur de la div dans ma page

Code :

<?php
//test
$numDiv= "prix_bapteme";
//fin
?>

Modification de l'appel de ma fonction:

Code :

<select name='tours' id='tours' onchange="prix_bapteme(tours.value,passager.value,option.value,<?php echo $idCircuit; ?>,<?php echo $idEvenement; ?>,<?php echo $numDiv; ?> )">

Et enfin, déclaration de la valeur de la div dans mon HTML

Code :

echo "<div id='".$numDiv."' style='display:inline'><span class='prix'>".$total." &#8364</span>";

J'ai donc implémenté tous ca, et ca ne marche pas. je reprecise que sans ce ciblage de div mon ensemble de script/fonction, marche très bien. c'est juste qu'il faut que j'améliore la chose en le rendant "dynamique".

Merci beaucoup pour votre aide

Message édité par kontas le 29-03-2011 à 20:14:52

knoodrake

je sui Liiiiiibre

en coup de vent, déjà:

function prix_bapteme(tours,passager,option,id_circuit,id_evenement,numDiv)
....
di = document.getElementById('numDiv').innerHTML;

tu passe la chaine de caractère 'numDiv' et non la variable numDiv !
Essaye plutôt di = document.getElementById(numDiv).innerHTML;

Edition rapide (tiens, c'est pratique le forum HFR): tu peux la déclarer tant que tu veux, ca ne change rien au problème précédemment cité: tu à toujours plusieurs fois le même ID !

Message édité par knoodrake le 29-03-2011 à 21:00:47

---------------
mes Photos!

kontas

Photographe amateur daltonien

A mince, j'avais posté sans rafraichir, du coup j'avais zapper ta réponse et posté mes expérimentations !

Pour le doublon d'id, comme un idiot j'avais inséré dans ma variable $numDiv la même valeur qui était déjà présente en "dur" pour le formulaire suivant.

Je comprend pas trop quel est le problème avec mon <span>, dans les autres partie du site il ne semble pas gêner, pourquoi là ca serait différent ?

merci

kontas

Photographe amateur daltonien

knoodrake a écrit :

Code :

di = document.getElementById('prix_bapteme_voiture_' + id_voiture );
di.innerHTML = xhr.responseText;

et bien par exemple:

Code :

// '#prix_bapteme_voiture_' + id_voiture +' > .prix' ca veut l'élément de class=prix enfant de prix_bapteme_x
// $() c'est le document.getElementById (et plus encore) de jQuery
// ..qui renvoi un tableau, donc on prend le premier => [0]
// et enfin, .html() c'est le innerHTML de jQuery
$('#prix_bapteme_voiture_' + id_voiture +' > .prix')[0].html(xhr.responseText);

Après faudra aussi modifier la balise <a> juste en dessous du span, puisque son onClick à l'air de renvoyer le prix.

Donc je Zap le innerHTML !

Je zap également l'utilisation de l'id de la voiture comme div, car je vais avoir la même voiture sur la même page ! mais ca c'est du détail, je ferais une génération automatique de nom de div.

Comme je disais juste au dessus, je ne comprend pas trop quel est le problème avec mon <span>, dans les autres partie du site il ne semble pas gêner, pourquoi là ca serait différent ?
sur cette page, ce script fonctionne parfaitement, certe il n'y as ce fameux ciblage dynamique dont j'ai besoin.
ce n'est pas que je me refuse a l'utilisation de Jquery, c'est juste que ca ma l'air compliqué :pt1cable:

J'ai bien essayé d'enlever les guillemets, pour faire passer la valeur de numDiv:

Code :

di = document.getElementById(numDiv);

mais j'ai l'erreur suivante qui apparait

Citation :

Impossible de définir la valeur de la propriété « innerHTML » : objet null ou non défini

Publicité

kontas

Photographe amateur daltonien

Après Moultes essais via un alert() placé dans ma fonction, j'ai réussi a déduire que lorsque le contenu de la variable $numDiv="divdeprixun", il renvoyer [object HTMLDivElement], alors que si ma variable est =1, mon alert() me renvoit bien 1 !

Et la comme par magie, ca marche !!!! C'est trop chouette, Merci a tous

Par contre, j'aimerais quand même savoir ce qui cloche avec le <span>
Une autre chose, la mon id de div est un entier, et j'étais persuadé qu'il ne fallait pas en utiliser pour en déclarer une [EDIT]W3c validator ne renvoit pas d'erreur pour ca, pour plein d'autre, mais pas celle la

Message édité par kontas le 29-03-2011 à 22:50:52

knoodrake

je sui Liiiiiibre

Rien de spécial avec le span.
C'était simplement que, comme tu à:

Code :

<div_prix>
<span> 20€ </span>
<lien> <image /> </lien>
</div_prix>

ben si tu fait div_prix.innerHTML = 30€, ca fera:

Code :

<div_prix>
30€
</div_prix>

Et donc, qu'il faut soit que le PHP renvoi tout l'intérieur, et pas que le prix ( qu'il renvoi <span>30€</span><lien><image/></lien> ), soit que le PHP ne renvoi que le prix (30€) mais dans ce cas, remplacer le contenu du <span> seulement, et pas de toute la div !

C'est tout :hello:

---------------
mes Photos!

kontas

Photographe amateur daltonien

Oky, je comprend maintenant

Par contre, internet explorer 9, m'indique que ma fonction renvoie bien

Code :

<span class='prix'>100 &#8364</span> <a href="#" onClick="panier_ajout(2,2, 0, 100,1)"><img src='./graph/panierplus.png'></a>

Message édité par kontas le 04-04-2011 à 21:46:04

FORUM HardWare.fr

Programmation

HTML/CSS

Variable PHP dans une fonction Javascript

Sujets relatifs
Besoin d'aide Php base de donnée	Mesurer le temps d'exec d'une fonction
Alimentation d'une variable avec données d'un tableau	macro en fonction d'une date
Php et Join SQL	Paiment enligne PHP
Génération de fichier XML avec PhP	Recuperer l'adresse d'une variable retournée - debutant
Blog : PHP et css - Formatage d'un article	Transfert d'une variable PHP dans une fonction javascript
Plus de sujets relatifs à : Variable PHP dans une fonction Javascript

Page générée en 0.078 secondes