Changer contenu sans recharger la page

Version imprimable

22/06/2009, 10h21
krustypop

Changer contenu sans recharger la page

Bonjour à tous,

voilà je suis en train de faire un site web, j'ai en gros 2 menu et un cadre principal. Je voudrais alimenter, en cliquant sur un lien d'un des menus, le cadre principal avec, si cela est possible, d'autres pages PHP, sans pour autant recharger la page.

J'ai donc une page qui serait une "base" et je voudrais changer son contenu, par exemple si je clique sur le lien "informatique" le contenu (cadre principal) se remplie avec "informatique.php".

Voilà j'espere avoir été à peu près clair.

Merci d'avance pour votre aide.
22/06/2009, 10h55
andry.aime

Salut,
1- Utiliser un iFrame pour charger les pages, les valeurs du target des liens sont le nom de l'iFrame, l'utilisation de l'iFrame est déconseillé.
2- Utiliser AJAX et afficher les pages dans un div. Fait un petit recherche dans le forum AJAX avec "rafraichir un div" ou regarder dans les tutoriels AJAX:
http://ajax.developpez.com/cours/
22/06/2009, 11h01
krustypop

Salut et merci du tuyau.

Je vais voir ça, on se tiens au jus!

Alors j'ai essayé d'incorporer un script, mais cela ne fonctionne pas, voici le code

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
 
 
<script type="text/javascript" src="js/prototype.js"></script>
	<script type="text/javascript" src="js/scriptaculous.js"></script>
	<script type="text/javascript" src="js/effects.js"></script>
 
	<script type="text/javascript">
	function envoieRequete(url,id)
		{		
			var xhr_object = null;
			var position = id;
			if(window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
			else
				if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
 
				// On ouvre la requete vers la page désirée
				xhr_object.open("GET", url, true);
				xhr_object.onreadystatechange = function(){
					if ( xhr_object.readyState == 4 )
					{
						// j'affiche dans la DIV spécifiées le contenu retourné par le fichier
						document.getElementById(position).innerHTML = xhr_object.responseText;
					}
															}
				// dans le cas du get
	xhr_object.send(null);
 
		}
</script> 
</head>
<body>
 
[..........]
 
 
 
if ($rs->RecordCount()!= 0)     // test : existe-t-il des réponses ?
{
 
        while (!$rs->EOF)                       // boucle de lecture des réponses
        {                                                               // récupération des différentes valeurs
                $secteur=($rs->fields['nomsecteur']);
                $rs->MoveNext();
                echo"<a href=\"#\" onclick="envoieRequete("secteurs.php?domaine=$domaine&secteur=$secteur",'test');">".$secteur."</a><br> " ;
 
        }
}
 
 
 
	<div class="corpsmain" id="test">
		<p> La Federation Syntec represente pres de 1250 groupes et societes francaises
			specialises dans les professions de l'Ingenierie, des Services Informatiques, de
			s Etudes et du Conseil, de la Formation Professionnelle. 
		</p>
 
	</div>

Voila, ceci est les éléments principaux mais il y a du code qui manque, qui je pense n'est pas important pour ce cas.

Merci de votre aide

22/06/2009, 13h11
andry.aime

Donnes nous le HTML généré.

Code:

echo"<a href=\"#\" onclick=\"envoieRequete('secteurs.php?domaine=$domaine&secteur=$secteur','test'); return false;\">".$secteur."</a><br> " ;
22/06/2009, 13h30
krustypop

Comment ca ?? désolé je suis un pti débutant....

En tout cas j 'ai l'erreur

Parse error: parse error, expecting `','' or `';'' in C:\wamp\www\OrienteExpress\TIC.php on line 89

ligne 89 qui la ligne ou il y a le lien.

Mais je ne sais pas ou il manque une virgule ou point virgule.

Merci de ton aide
22/06/2009, 14h16
andry.aime

Citation:

Parse error: parse error, expecting `','' or `';'' in C:\wamp\www\OrienteExpress\TIC.php on line 89
ligne 89 qui la ligne ou il y a le lien.

J'ai déjà corrigé l'affichage du lien qui est tronqué avec les guillemets non échappés.

Code:

echo"<a href=\"#\" onclick=\"envoieRequete('secteurs.php?domaine=".$domaine."&secteur=".$secteur."','test'); return false;\">".$secteur."</a><br> " ;

Citation:

Donnes nous le HTML généré.

Le code HTML dans le l'affichage du code source dans ton navigateur.
22/06/2009, 14h28
krustypop

Quel boulet!!

Merci d'avoir corrigé, ça a réglé mon soucis et cela répond à mon besoin.

Encore merci, grâce à toi j'ai fait mon premier script en Ajax!

A+ et encore merci!!
22/06/2009, 14h36
krustypop

Ah !

J'ai crié trop vite victoire!

En fait maintenant que mon texte s'affiche correctement, lorsque je clique sur le bouton Actualiser du navigateur, le texte disparait et un autre apparait (celui qui est en dur dans la page php, dans laquelle j'appelle les autres).*

Merci de m'aider à régler ce dernier point.
22/06/2009, 14h42
andry.aime

Quand tu actualises la page avec le bouton Actualiser du navigateur,
c'est le contenu affiché lors du premier chargement qui doit s'afficher.
Dans ton cas le contenu du div test par défaut qui s'affichera.
Si tu veux que le contenu affiché soit le résultat d'une requête, tu appelles
la fonction ajax dans le onload du body avec le lien à afficher par défaut.
22/06/2009, 15h18
krustypop

C'est pareil, j'ai mis l'appelle de la fonction avec mon texte par défaut dans une autre page "accueilTIC.php" comme ceci:

Code:

<body onload=envoieRequete('accueilTIC.php','test'); return false;">

Et lorsque je clique sur Actualiser c'est pareil, ce texte s'affiche et ne me garde pas celui qui était affiché.

Merci beaucoup pour ton aide.
22/06/2009, 15h38
andry.aime

J'ai mal expliqué,
Avec ce code c'est la page accueilTIC.php qui s'affiche lors de l'actualisation.
Mais si tu veux sauvegarder la dernière contenue, utilise un cooki.
22/06/2009, 15h46
krustypop

Merci de ta réponse,

aurais-tu une bribe de code car j'utilise trop peu souvent les cookis pour les utiliser.

Merci encore
22/06/2009, 15h50
andry.aime

Dans la faq:
http://javascript.developpez.com/faq...=navig#cookies