[AJAX] GetelementId

Bonjour,

voila je debute en ajax / javascript et j'essaye de faire un menu dynamique qui liste les repertoire de mon disque dur avec un menu qui lui aussi devra etre dynamique.

je vous joint le code :

Index.html

Code:

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
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<html>
	<head>
		<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>
		<script type='text/javascript'>
 
	 	document.write('<STYLE TYPE=text/css>');
		document.write('.Muby_styl_scroll {font-size:12px;font-family:Verdana;color:#FFFFFF;text-decoration:none}');
		document.write('</STYLE>');
		Muby_largeur = 120;
		Muby_hauteur = 500;
		Muby_bgcolor = '#000000';
		Muby_menu = new Array;
		Muby_mode = 1;
 
		function Muby_show(menu)
		{
 
			if(menu == "menu")
			{
				var html = "<TABLE BORDER=1 BORDERCOLOR=black WIDTH=100% CELLSPACING=0 BGCOLOR="+Muby_bgcolor+">";
				for(a=0;a<Muby_menu.length;a++)
				{
				    html += '<TR><TD ><A id="DD" name="'+Muby_menu[0]+Muby_menu[a]+'" HREF="#" onClick="go()" CLASS=Muby_styl_scroll >'+Muby_menu[a]+'</A></TD></TR>';
				}
				html += "</TABLE>";
 
				document.getElementById("Muby_scroll_1").innerHTML = html;
				if(Muby_mode == 2)
				    Muby_action(1);
			}
			else
			{
				alert(document.getElementById("DD2").name);
				var html = "<TABLE HEIGHT="+(Muby_hauteur-15)+" BORDER=1 BORDERCOLOR=black WIDTH=100% CELLSPACING=0 BGCOLOR="+Muby_bgcolor+"><TR><TD HEIGHT=20 ALIGN=center CLASS=Muby_styl_scroll>"+Muby_menu[menu]+"</TD></TR><TR><TD HEIGHT="+(Muby_hauteur-55)+" VALIGN=top CLASS=Muby_styl_scroll>"+Muby_lien[menu]+"</TD></TR><TR><TD HEIGHT=20 CLASS=Muby_styl_scroll>&lt; <A HREF=# onClick='Muby_show(\"menu\");return(false)' CLASS=Muby_styl_scroll>Retour</A></TD></TR></TABLE>";
				document.getElementById("Muby_scroll_2").innerHTML = html;
				if(Muby_mode == 1)
				    Muby_action(2);	
			}
		}
 
 
		Muby_cursor = Muby_largeur;
 
		function Muby_action(action)
		    {
		    if(action == 2)
		        {
		        if(Muby_cursor>0)
		            {
		            Muby_cursor -= 10;
		            document.getElementById("Muby_scroll_1").style.left = Muby_cursor-Muby_largeur;
		            document.getElementById("Muby_scroll_2").style.left = Muby_cursor;
		            setTimeout("Muby_action("+action+")",1);
		            Muby_mode = 2;
		            }
		        }
		    else
		        {
		        if(Muby_cursor<Muby_largeur)
		            {
		            Muby_cursor += 10;
		            document.getElementById("Muby_scroll_1").style.left = Muby_cursor-Muby_largeur;
		            document.getElementById("Muby_scroll_2").style.left = Muby_cursor;
		            setTimeout("Muby_action("+action+")",1);
		        Muby_mode = 1;
		            }
		        }
		    }
 
		function getXhr()
		{
		        var xhr = null; 
			if(window.XMLHttpRequest) // Firefox et autres
			   xhr = new XMLHttpRequest(); 
			else if(window.ActiveXObject)
			{ // Internet Explorer 
			   try 
			   {
		                xhr = new ActiveXObject("Msxml2.XMLHTTP");
		           } catch (e) 
		           {
		                xhr = new ActiveXObject("Microsoft.XMLHTTP");
		           }
			}
			else 
			{ // XMLHttpRequest non supporté par le navigateur 
			   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
			   xhr = false; 
			} 
		        return xhr;
		}
 
			/**
			* Méthode qui sera appelée sur le click du bouton
			*/
			function go(){
				var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function()
				{
					// 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)
					{
						Muby_menu= null;
						leselect = xhr.responseText;						
						if(leselect.indexOf('|') != -1) 
							Muby_menu = leselect.split('|');
						Muby_show('menu');
 
					}
					else
					{
						 Muby_menu=null;
						 var html = "<TABLE BORDER=1 BORDERCOLOR=black WIDTH=100% CELLSPACING=0 BGCOLOR="+Muby_bgcolor+">";
						 html += '<TR><TD><font color=red>Loading...</TD></TR>';
						 html += "</TABLE>";
						 document.getElementById("Muby_scroll_1").innerHTML = html;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","List_rep.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, l'id de l'auteur
				sel = document.getElementById('DD');
 
				xhr.send("DD="+sel.name);
			}
 
 
		</script>
	</head>
	<body>
 
 
		<DIV ID=Muby_relativ STYLE="position:relative;width:120;height:300">
			<a href="#" id=Muby_scroll_1 name="c:\\nvidia" style="position:absolute;width:112;left:0;top:0;" CLASS=Muby_styl_scroll>Chargement du menu ...</a>
			<div id=Muby_scroll_2 style="position:absolute;width:'112;top:0;left:120;" CLASS=Muby_styl_scroll></DIV>
		</DIV>
 
				<a id='DD' href="#" onClick="go()" name="C:\\"> C:\</a>
 
	</body>
</html>

list_rep.php

Code:

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
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<?php
function filtre($texte)
{
	$texte = str_replace("","%E0",$texte);
	$texte = str_replace("","%E2",$texte);
	$texte = str_replace("","%E3",$texte);
	$texte = str_replace("","%E7",$texte);
	$texte = str_replace("","%E9",$texte);
	$texte = str_replace("","%E8",$texte);
	$texte = str_replace("","%EA",$texte);
	$texte = str_replace("","%EB",$texte);
	$texte = str_replace("","%EC",$texte);
	$texte = str_replace("","%EE",$texte);
	$texte = str_replace("","%EF",$texte);
	$texte = str_replace("","%F2",$texte);
	$texte = str_replace("","%F4",$texte);
	$texte = str_replace("","%F6",$texte);
	$texte = str_replace("","%F9",$texte);
	$texte = str_replace("","%FB",$texte);
	$texte = str_replace("","%FC",$texte);
	$texte = str_replace("#","%23",$texte);
	$texte = str_replace("(","%28",$texte);
	$texte = str_replace(")","%29",$texte);
	$texte = str_replace("+","%2B",$texte);
	$texte = str_replace(",","%2C",$texte);
	$texte = str_replace("'","%27",$texte);
	$texte = str_replace("&","%26",$texte);
	$texte = str_replace("=","%3D",$texte);
	$texte = str_replace("-","%2D",$texte);
	return $texte;
}
 
 
	if(isset($_POST['DD'])){
 
 
 
			$dur = $_POST['DD'];
			$cpt_Rep=0;
			if (@$dossier == "")
				$racine = $dur;
			else 
				$racine=$dossier;
			$i=0;
			$opensubdir=OpenDir("$racine");
			$racine2 = substr($racine,4);
			echo $dur."|";
			while ($zone = readdir($opensubdir))
			{
				$i++;
 
				$url2=filtre($zone);
			    	if($zone!="\$WIN_NT$.~BT" && $zone != "." && $zone != ".." && $zone != "Vignettes" && is_dir($racine."/".$zone) && $zone != "System Volume Information" && $zone != "RECYCLED" && $zone != "RECYCLER"  && $zone != "_Restore" && $zone != "Folder Settings" && $zone != "\$RECYCLE.BIN" && $zone !="\$Recylcle.Bin")
				{
					echo strtolower($zone)."|";
 
				}
 
 
			}
 
 
	}
?>

Mon problème est que quand j'éxécute ce code, je recupere bien la premiere fois tous les repertoires de mon disque dur C, mais ensuite lorsque je click sur un liens d'un repertoire de mon disque dur, impossible de recuperer ce que contient l'id : DD. Pourtant j'ai bien mis dans le <A , id = DD.

Merci d'avance