Hello tous !
J'ai développé un site en php et pour changer un peu j'aimerai bien transformer mon menu pour que les liens puissent charger le corps de ma page sans recharger entièrement la dite page.
Bref, Ajax est mon ami.
J'ai lu pas mal de tutos et testé beaucoup d'exemples (renvoyant généralement les données dans des textbox) mais quand, sûr de moi, j'ai voulu enfin me lancer dans le développement du menu... ça coince ! C'est frustrant.
Pourtant j'ai trouvé un script tout simple, que j'ai un peu modifié :
Ma page index.html
Ma page ajax.js
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 <html> <head> <title>Mon premier menu AJAX</title> <script src='ajax.js'></script> </head> <body> <div id='menu'> <ul> <li><a href="javascript:void(0);" onClick='check_content("page.php?id=index")'>Accueil</a></li> <li><a href="javascript:void(0);" onClick='check_content("page.php?id=contact")'>Contact</a></li> </ul> </div> <div id='content'> Conteneur </div> </body> </html>
Ma page page.php
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 function makeObject(){ var x; if (window.ActiveXObject) { x = new ActiveXObject("Microsoft.XMLHTTP"); }else if (window.XMLHttpRequest) { x = new XMLHttpRequest(); } return x; } var request = makeObject(); var the_content; function check_content(the_content){ request.open('get', the_content); request.onreadystatechange = parseCheck_content; request.send(''); } function parseCheck_content(){ if(request.readyState == 1){ document.getElementById('content').innerHTML = 'Loading...'; } if(request.readyState == 4){ var answer = request.responseText; document.getElementById('content').innerHTML = answer; } }
Ce code me semble parfaitement logique mais ne marche pas.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 <?php $id = $_GET['id']; if ($id == 'index'){ echo "Cette page est l'index"; } else if ($id == 'contact'){ echo "Page des contacts"; } else{ echo "Erreur - Page innexistante"; } ?>
Quand on clique sur un lien, on distingue le chargement du readyState quelques secondes puis rien ne s'affiche...
"the_content" ne contiens rien...
Une idée de la cause ?
Ce script, s'il est corrigé, pourra aider pas mal de personne qui débutent comme moi car il offre une base solide pour commencer à comprendre les mécanismes d'Ajax et je n'ai pas trouvé d'équivalent avec google.
Vous voyez la grosse bourde commise dans ce script ?
merci !
Partager