[AJAX] ajax et système d'onglet

**sneb5757** · 11/08/2008, 12h21

Bonjour

J'ai un problème qui à mon avis est pas trop compliqué mais je bloque. Je cherche à faire un site avec des "onglet". En faite mes onglets sont des liens. Une fois que je clique sur ces liens une page est chargé dans une div situé dans sur la même page que les onglet. J'utilise ajax pour ne pas à avoir à recharger toute la page.

Le problème est que des que je clique sur le lien la page est chargée mais disparait aussitôt. J'ai fait une page de test sur laquelle j'ai mis un lien et un bouton radio. Des que je clique sur le lien, ma page se charge mais disparait aussitôt. Alors que si je clique sur le bouton radio ma page se charge et reste.

voici le code de ma page de test

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
 
 
<html>
<head>
<script language="JavaScript" type="text/javascript" src="./js/fonction.js">
<!--
 
//-->
</script>
 
<title>Untitled</title>
</head>
<body>
<a href=""  onclick="javascript:load_page('profil.php')">photo et profil</a>
<input type='radio'  onclick="javascript:load_page('profil.php')">essai
<div id='divPage'>
 
</div>
 
</body>
</html>

le code de mes fonction javascript contenu dans fonction.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
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
 
 
 
function new_xhr(){
	var xhr_object = null;
	if(window.XMLHttpRequest) // Firefox et autres
	   xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject){ // Internet Explorer
	   try {
                xhr_object = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
            }
	}
	else { // XMLHttpRequest non supporté par le navigateur
	   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
	   xhr_object = false;
	}
	return xhr_object;
}//fin new_xhr
 
function load_page(page) {
 alert(page);
	var xhr2 = new_xhr();//On crée un nouvel objet XMLHttpRequest
	xhr2.onreadystatechange = function()
{
 
		if ( xhr2.readyState == 4 ){//Actions executées une fois le chargement fini
			if(xhr2.status  != 200){//Message si il se preoduit une erreur
				alert("Error code " + xhr2.status);
			} else {//On met le contenu du fichier externe dans la div "content"
				document.getElementById("divPage").innerHTML = xhr2.responseText;
			}
		} else {//Message affiché pendant le chargement
			document.getElementById("divPage").innerHTML = "Chargement en cours ...<img src='./image/loading.gif' alt=''/>";
		}
	}
 
	xhr2.open("GET", page, true);//Appel du fichier externe
 
	xhr2.send(null);
}//fin load page

et enfin le code de profil.php

Code :

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

1
2
3
4
 
 <?php
 echo "page chargée";
?>

J'aimerai comprendre pourquoi lorsque je clique sur le lien la page disparait alors que si je clique sur le bouton radio non.

**Bovino** · 11/08/2008, 12h24

Code :

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

<a href="#"  onclick="load_page('profil.php');return false">

**sneb5757** · 11/08/2008, 13h44

merci ça marche

. Je vais mettre un tag resolu mais avant j'aurais une question :

Pourquoi faut il mettre cette instruction (return false; ) ?

**Bovino** · 11/08/2008, 13h51

Pour annuler l'effet du href qui s'il est vide (href="") recharge la page

[AJAX] ajax et système d'onglet

JavaScript

Discussions similaires

Partager

Partager