probleme de changement d'image dans un tree menu

**K_!!!** · 18/01/2006, 17h42

Bonjour a vous,

je suis en train de developper un menu dynamique en arborescence avec lorsque l'on clique sur le " plus ", il y a expansion du sous menu.

Jusque la tout fonctionne, seulement j'aimerai que le "plus" devienne un "moins" une fois cliquer et inversement losque l'on reclique pour contracter a nouveau le menu. Et c'est la le probleme, parce que ca le fait bien pour le premier element du menu, mais a chaque fois que je clique sur un autre " plus " du menu, c toujours le premier qui change.

est ce que quelqu'un pourrait m'eclairer , svp ?

voici mon code :

* la fonction javascript qui permet l'expansion/contraction du sous menu, mais egalement le changement d'image

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
 
<script language="javascript">
function ChangeAndOpen(ID)
{
 
var imgopen = new Image();
imgopen.src = "minus.gif";
 
var imgclose = new Image();
imgclose.src = "plus.gif";
 
 
         if (document.getElementById(ID).style.display == 'block')
		            {
 
document.getElementById(ID).style.display = 'none';
document.getElementById("image_link").src = imgclose.src ;								}
		else
		            {
 
document.getElementById(ID).style.display = 'block';
document.getElementById("image_link").src = imgopen.src ;	
		            }	
}
 
</script>

et le code de l'image

Code :

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

1
2
 
response.Write("<img onmouseover=""this.style.cursor='hand'"" onclick='ChangeAndOpen(""" & rs("ID") & """)' src ='plus.gif' ID ='image_link' name ='StrImage'/>")

j'avais essayer differemment

Code :

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

1
2
3
 
response.write("<A ID='link_Image' onmouseover=""this.style.cursor='hand'"" onclick='ChangeAndOpen(""" & rs("ID") & """)'>")
response.Write("<img src ='plus.gif' ID ='image_link' name ='StrImage'/></A>")

mais ca ne marche pas plus

desole si ce n'est pas le bon forum, mais comme ca marche pour le premier resultat, j'avais l'impression que ct au niveau du code asp qu'il y avait un probleme et non le javascript .

merci d'avance pour votre aide

**K_!!!** · 18/01/2006, 17h50

re, en fait je me suis apercu que ca serait peut etre plus simple si je mettais toute la fonction qui creer le menu...

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
 
function createtree(parent_id,ByVal level)
 
   level = level + 1 
   Dim rs 
   Set rs = server.CreateObject("ADODB.recordset") 
		rs.open"   SELECT * FROM tree_hierarchy WHERE parent = " & parent_id , strProvider & " order by IDFollows"
 
 
 
			WHILE NOT rs.EOF 
		        response.Write("<p style='margin-left: " & level * 40 & "px; margin-top: 0px; margin-bottom: 3px'>"  ) 
 
				IF rs("Child") = FALSE THEN
 
				   response.Write("<img src  = " & Rs("image") & "> &nbsp;" )
				   response.Write("<label>" & rs("Title") & "</label><br>" ) 
 
				ELSE 
 
				    response.Write("<img onmouseover=""this.style.cursor='hand'"" onclick='ChangeAndOpen(""" & rs("ID") & """)' src ='plus.gif' ID ='image_link' name ='StrImage'/>")
 
 
 
						  	if rs("ID") = 1 then
							response.Write("<img src  = 'desktop.gif'> &nbsp;" )
						  	else
							response.Write("<img src  = " & Rs("image") & "> &nbsp;" )
						  	end if
 
						    if rs("url") <> "" then
				            response.Write("<label><A style='text-decoration:none; color:#000000 '; target='_blank'; href = " & rs("url") & " >" & rs("title")  &"</a></label>")
				            else
				            response.Write("<label>" & rs("Title") & "</label><br>" )
			   	            end if
 
						  response.Write("<Div id = " & rs("ID") & " style='display:none'>")
						  call createtree(rs("ID"),level)
						  response.Write("</div>")
 
				END IF 
                rs.movenext
            WEND 
      rs.close 
   Set rs = Nothing 
end function

merci encore

**franculo_caoulene** · 18/01/2006, 17h51

Salut,

Le problème a plutôt l'air d'être javascript selon moi. L'idée est d'avoir un identifiant unique par page. Or tu as le même ID pour tes images. Tu ne changes donc que la 1ere.
Donne la source HTML générée par l'ASP et je déplacerai ton sujet éventuellement.

**K_!!!** · 18/01/2006, 18h02

merci pour ta reponse,

en fait j'ai tout mis la , parce que sur ma page , il n'y a rien a part la fonction javascript et cette fonction creationtree qui est appelee avec :

Code :

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

1
2
 
call createtree(1,level)

merci encore

**franculo_caoulene** · 18/01/2006, 18h56

euh... je fais quoi moi maintenant? J'ai raison ou tort? Où est la source HTML demandée? Tu en es où dans ton problème?

**K_!!!** · 19/01/2006, 09h39

salut,

effectivement, comme tu l'as souligne, les images ont le meme ID...
seulement, je ne sais pas comment faire pour que ca change a chaque fois...

voici donc le code genere :

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
 
 
<img src  = desktop.gif> &nbsp;<label>Root</label><br>
 
<p style='margin-left: 0px; margin-top: 0px; margin-bottom: 3px'>
 
<img onmouseover="this.style.cursor='hand'" onclick='ChangeAndOpen("28")' src ='plus.gif' name ='StrImage' ID ='image_link'/>
<img src  = folder.gif> &nbsp;<label>Version History</label><br>
 
<Div id = 28 style='display:none'>
<p style='margin-left: 40px; margin-top: 0px; margin-bottom: 3px'>
<img src  = note.gif> &nbsp;<label>version 2.0</label><br></div>
 
<p style='margin-left: 0px; margin-top: 0px; margin-bottom: 3px'>
<img onmouseover="this.style.cursor='hand'" onclick='ChangeAndOpen("20")' src ='plus.gif' name ='StrImage' ID ='image_link'/>
<img src  = lopb.gif> &nbsp;<label>Folder 4</label><br>
 
<Div id = 20 style='display:none'><p style='margin-left: 40px; margin-top: 0px; margin-bottom: 3px'>
<img onmouseover="this.style.cursor='hand'" onclick='ChangeAndOpen("21")' src ='plus.gif' name ='StrImage' ID ='image_link'/>
<img src  = pm.gif> &nbsp;<label><A style='text-decoration:none; color:#000000 '; target='_blank'; href = # >Procmap 4</a></label>
 
<Div id = 21 style='display:none'>
<p style='margin-left: 80px; margin-top: 0px; margin-bottom: 3px'>
<img src  = note.gif> &nbsp;<label>owner 4</label><br>
 
<p style='margin-left: 80px; margin-top: 0px; margin-bottom: 3px'>
<img src  = note.gif> &nbsp;<label>doc number 4</label><br>
 
<p style='margin-left: 80px; margin-top: 0px; margin-bottom: 3px'><img src  = note.gif> &nbsp;<label>revision4</label><br>
<p style='margin-left: 80px; margin-top: 0px; margin-bottom: 3px'><img src  = note.gif> &nbsp;<label>status 4</label><br>
</div>
</div>

merci encore pour votre aide

ps: heu...franculo_caoulene.... desole pour le contretemps

**franculo_caoulene** · 19/01/2006, 10h14

Tu ne sais pas changer l'ID de tes images? Pourtant tu le fais pour tes div

!
Div d'ailleurs inutiles je penses, tu peux directement mettre cet ID dans le <p> et supprimer supprimer les <div>. Enfin c'est accessoire!

Dans ton code ASP :

Code :

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

response.Write("<img onmouseover=""this.style.cursor='hand'"" onclick='ChangeAndOpen(""" & rs("ID") & """)' src ='plus.gif' ID ='image_link" & rs("ID") & "' name ='StrImage'/>")

Dans le javascript :

Code :

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

document.getElementById("image_link"+ ID).src

Ca devrait être bon.

Fais bien attention a tes syntaxe (X)HTML aussi. Attributs en minuscule, toujours entourer leur valeur par des " ou ', etc.

**K_!!!** · 19/01/2006, 10h45

Merci c bon !!

je n'etais pas tres loin,en fait, j'avais deja essayer de faire comme tu as dit , mais je me suis gourre avec les " et ', et donc ca ne marchait pas ....

j'en profite pour poser une autre petit question :

je voudrais faire en sorte que les elements du menu soient relies entre eux par des branches ( un peu comme l'explorateur windows ),donc je vais me pencher dessus, mais est ce que tu aurais un p'tit conseil ou un exemple, svp ?

en tous les cas encore merci pour ton aide

**franculo_caoulene** · 19/01/2006, 10h57

1) pas de quoi on est tous là pour ça... même toi

2) il y a un bouton Résolu en bas à gauche
3) j' ai vu des menus de ce genre mais je ne sais pas où les trouver. C'est quelque chose de typique, navigue dans les différents sous-domaines de dvp.com.

probleme de changement d'image dans un tree menu

ASP

Discussions similaires

Partager

Partager