Discussion :

[antoto]

Bonjour, je suis en stage et j'ai un problème desoler je ne sais pas dans qu'elle partie il faut poster, mais bon.


Mon probleme est que je suis en train de faire un site ou on peut bouger tout les elements ( aussi en ajouter) et choisir la couleur de chacun puis par la suite envoyer tout sa a une page php pour generer une image.

Pour l'instant j'arrive un peu pres a ajouter des element (enfin 5 via un switch donc le truc simple je que devrai ameliorer par la suite via une fonction).

Mon gros probleme est que j'arrive a recupere les donner que des image mais que dans un formulaire et quand je bouge une image sa efface les donnée precedente alors j'aimerai savoir si vous avez une idee pour m'aider voici mon code qui sera plus explicite que mon texte.




ça c'est les element deplaçable de ma page( enfin 2 pour l'exemple mais en theorie je devrai en avoir plein)

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
 
 
 
        <div id="divTest" name="divTest" onMouseOver="fnOnMouseOver('divTest');" onMouseUp="test(id)" onMouseOut="fnOnMouseOver();">
 
          <p>Salut lulu</p>
 
 
 
        </div>  
 
 
 
 	<img src="image/motif4.png" id="revertbox2" name="revertbox2" onMouseOver="fnOnMouseOver('revertbox2');"  onMouseUp="test(id)" onMouseOut="fnOnMouseOver();" />

La c'est mon code javascript pour calculer la postition des images.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
 
function test(identifiant){
 
 
 
 
 
 
 
gauche=eval('document.all.'+identifiant+'.offsetLeft');
 
haut=eval('document.all.'+identifiant+'.offsetTop');
 
 
 
 
 
	document.forms["general"].elements["gauche"].value=gauche;
 
	document.forms["general"].elements["haut"].value=haut;
 
	//document.forms["general"].elements["style"].value=style;
 
	document.forms["general"].elements["nom"].value=identifiant;
 
  }

voici le code mon formulaire

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
<FORM name="general" action="test2.php" method="post"><br />
 
x
 
<INPUT type="text" name="gauche" value=""><br />
 
y
 
<INPUT type="text" name="haut" value=""><br />
 
nom de la div
 
<INPUT type="text" name="nom" value=""><br />
 
 
 
largeur
 
<INPUT type="text" name="largeur" value=""><br />
 
hauteur
 
<INPUT type="text" name="hauteur" value=""><br />
 
 
 
 
 
texte:
 
<input type="text" name="txt"><br />
 
couleur contenu
 
<input type="text" name="hexval" size="9" onChange="document.bgColor = document.form.hexval.value;"><br />
 
couleur fond
 
<input type="text" name="hexaval" size="9" onChange="document.bgColor = document.form.hexaval.value;"><br />
 
 
 
<input type="submit" value="ahh" />
 
</FORM>

enfaite je pense qu'il faut autant de formulaire que d'élément deplaçable mais je ne vois pas comment faire un fonction qui gére ça .

Donc voila merci a ceux qui pourrons m'aider.

[le_chomeur]

solution la plus simple :
garder tes champs , en y ajoutant des séparateurs pour chaques images ..
ou alors gérér pour chaque image un champs corespondant , par exemple :
<INPUT type="text" name="Img1haut" value=""><br />
c'est assez lourrd

je te préconise :

Code :

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

<INPUT type="text" name="haut[]" value="" id="img1"><br />

tu assigneras a cette balise la valeur heut de l'image 1 et coté php tu parseras le tableau ...

[antoto]

Merci de m'avoir repondu aussi vite, j'ai essayer de comprendre ta solution avec un tableau mais je vois pas comment tu t'y prend.

J'ai essayer la solution lourde mais le probleme c'est que je doit prévoir a l'avance ou limité le nombre d'image, je vais essayer de creuser ta solution de tableau.

[le_chomeur]

coté html :

tu génères pour chaque image un champs caché :

Code :

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

1
2
3
<img src="" id="Monimg1" onMouseOver="fnOnMouseOver('Monimg1');"  onMouseUp="test(id)" onMouseOut="fnOnMouseOver();">
 
<INPUT type="hidden" name="haut[]" value="" id="img1"><br />

la méthode , ira remplir la valeur de img1
puis coté serveur , tu récupères le contenu de tout ton tableau , en sachant que la valeur a l'index 0 de ton tableau haut[] équivaut a la valeur haut de ton image 1

[antoto]

Je pense avoir compris un peu pres je vais essayer ta methode et si j'ai des probleme bin tu verra un message de plus qui diras a l'aide lol.

au faite bon ap c'est bientot midi