Bonjour a tous,
J'ai actuellement un probleme : Je transforme mon site en ajax pour eviter le rechargement de toute la page, et ca marche impec.

Pourtant lorsqu'un visiteur tape l'adresse d'une de mes pages générées en ajax cela ne marche pas


Exemple :
quand on tape http://monsite.fr/index.php/#/page1et bien le visiteur ce retrouve quand meme sur http://monsite.fr


Voila mon code en javascript

/*************************************************
	Fonction de definition de l'object xhr
**************************************************/
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;
}
/*****************************************************
	Fonction qui va recharger le contenu
******************************************************/
function load_page(select) {
	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
				document.getElementById("test").innerHTML ="Error code " + xhr2.status;
			} else {//On met le contenu du fichier externe dans la div "content"
				document.getElementById("test").innerHTML = xhr2.responseText;
			}
		} else {//Message affiché pendant le chargement
			document.getElementById("test").innerHTML = "<center>Chargement <br /><img src='images/loading.gif' alt=''/></center>";
		}
	}
	xhr2.open("GET", select.split('/#/')[1], true);//Appel du fichier externe
	xhr2.send(null);
}

Et voila la maniere dont elle est appelé :

<a href="/#/pages/acceuil.php" onclick="load_page(this.href);return false;" class="highlight1" title="Accueil">Accueil</a>



Cordialement

window.onload = function() {
	var a = document.location.split('#');
	load_page('/#' + a[1]);
}

window.onload = function () {load_page(location.href);};

et

select.split('/#/')[1]
//utilise le truc fait pour
location.hash

Dans ma fonction Onload j'ai déjà pas mal de trucs (j'ai cru comprendre qu'on ne pouvait pas charger deux onload en meme temps

J'arrive donc a ca

window.onload = function(){
	createPlayer(<?php echo $player; ?>, false);
	var doc=document.location.href.split("/#/");
	load_page('/#/' + doc[1]);
};
function init() { 
	createPlayer(<?php echo $player; ?>, false); 
	Shadowbox.init();
    	initDemos();

}
window.onload = init;

Mais ca ne marche pas

window.onload = function(){
	createPlayer(<?php echo $player; ?>, false);
	load_page(location.href);
	Shadowbox.init();
    	initDemos();
};

Yep, ca simplifie grandement les choses merci Tiller.

Faut juste que je trouve maintenant le moyen de faire la difference entre les pages en ajax et en php simple.

Parcequ'avec le code actuellement le script tente d'ouvrir n'importe quel lien en ajax
Alors qu'il doit ouvrir uniquement les pages avec /#/ devant

if (location.hash) {
    load_page(location.href);  
}

Merci beaucoup !

Dernier soucis (j'espere)

Actuellement lorsqu'on clique sur un lien en ajax on se retrouve avec une url de type :

http://monsite.fr/#/pages/acceuil.php

J'aimerais rendre l'url plus sympa du style http://monsite.fr/#/acceuil.php

Apres promis j'arrete avec les questions

bah, tu vires le pages/ dans tes liens, et avant d'envoyé l'ajax tu le rajoute..

xhr.open('truc', 'pages/' + bidul, false);

Ou alors en PHP après

Tiens en parlant de sa, pendant que le sujet est tout chaud, j'arrive pas à parvenir à mes fins de mon côté. La mise à jour de la div se fait bien mais quand je fais F5, je retourne à l'index du site et je retombe par sur la même page:

<!-- Mise à jour des pages via rechargement du navigateur -->
function MAJPage(page,changeHash){
	//Si le 2eme argument vaut TRUE on change le hash sinon on se contente de mettre a jour la page
	if (changeHash)
		document.location.hash=page;
	//On met donc à  jour la page
	//On enlève le # pour éxécuter convenablement la fonction affdyn()
	page = page.replace(/#/gi, "");
	// Et on met à jour la page en modifiant la div 'cct'
	Ajax.updater('cct','mods/'+page, {Method: 'get'});
	//on met a jour le hash en cours pour que la fonction dans l'intervale puisse continuer a fonctionner normalement
	hash_en_cours = '#mods/'+page;
}

<!-- Récupération du hash de l'URL pour mise à jour des pages -->
function MAJPageviaHash(){
	//on recupere le hash de depart
	hash_en_cours = document.location.hash;
	//Si on a un hash au chargement on met a jour la page en concequence
	if (hash_en_cours != "") {
		MAJPage(hash_en_cours,false);
	}
	window.setInterval(function (){
		//vérifie s'il n'y a pas un changement de hash
		if (hash_en_cours != document.location.hash) {
			//en cas de changement on récupere le nouveau hash et on rapelle chargePage
			MAJPage(document.location.hash,false);
		}
	},100)
}

li><a href="#" onclick="MAJPage('shop/catalogue.php',true); return false;">Catalogue</a></li>

Aborescence de mon site:
/index.php
/mods/shop/catalogue.php

Les commentaires Javascript ne sont PAS avec <!-- --> (BIS) !

Je vois pas l'interet d'un setinterval, qui plus ai toute les 100ms °°
C'est super lourd.

Ok pour les commentaires mais sinon sa fonctionne toujours pas

Bah je vois toujours pas l'interet du setinterval.

Ok, mais même supprimé le setInterval, çà ne change rien car il ne fait que boucler la fonction mais ce n'est pas la cause du problème

Citation : titipotter

Tiens en parlant de sa, pendant que le sujet est tout chaud, j'arrive pas à parvenir à mes fins de mon côté. La mise à jour de la div se fait bien mais quand je fais F5, je retourne à l'index du site et je retombe par sur la même page:

// Mise à jour des pages via rechargement du navigateur
function MAJPage(page,changeHash){
	//Si le 2eme argument vaut TRUE on change le hash sinon on se contente de mettre a jour la page
	if (changeHash)
		document.location.hash=page;
	//On met donc à  jour la page
	//On enlève le # pour éxécuter convenablement la fonction affdyn()
	page = page.replace(/#/gi, "");
	// Et on met à jour la page en modifiant la div 'cct'
	Ajax.updater('cct','mods/'+page, {Method: 'get'});
	//on met a jour le hash en cours pour que la fonction dans l'intervale puisse continuer a fonctionner normalement
	hash_en_cours = '#mods/'+page;
}

// Récupération du hash de l'URL pour mise à jour des pages
function MAJPageviaHash(){
	//on recupere le hash de depart
	hash_en_cours = document.location.hash;
	//Si on a un hash au chargement on met a jour la page en concequence
	if (hash_en_cours != "") {
		MAJPage(hash_en_cours,false);
	}
	window.setInterval(function (){
		//vérifie s'il n'y a pas un changement de hash
		if (hash_en_cours != document.location.hash) {
			//en cas de changement on récupere le nouveau hash et on rapelle chargePage
			MAJPage(document.location.hash,false);
		}
	},100)
}

li><a href="#" onclick="MAJPage('shop/catalogue.php',true); return false;">Catalogue</a></li>

Aborescence de mon site:
/index.php
/mods/shop/catalogue.php

Personne aurait une idée?

Toujours personne ?

Euh je comprend pas l'intérêt d'avoir des urls du type monsite.fr/index.php/#/page1
Au pire, tu fais de l'url rewrite et tu met monsite.fr/index-1.php qui appellera le bon fichier.
Mais faire du chargement par AJAX, je trouve ça un peu bourrin, et pas fiable et compatible ?

Je veux simplement chargé mais pages plus rapidement via ajax et masqué le chemin exact vers le fichier appellé et j'ai pas envie de passer par l'URL rewriting.
Je demande simplement une solution à mon problème, pas un avis sur le plus intéressant ou pas.

Et pourquoi ça rechargerai la dernière page affichée par ajax ?

Car a chaque lien il remet a jour le #.. donc en actualisant, le #.. reste, et il veux via JS, recharger cette page

Oui c'est exactement sa sauf que vous ne voulez pas me donner la solution

MAAAAAAAAAAMMMMMMMMMMMMMMMMAAAAAAAAAAAANNNNNNNNNNNNNNNNNNN !!!

-.-

Non sérieusement, vous ne connaissez pas la solution où vous ne voulez pas m'aider?

Le topic est parti en couille
bon j'avoue ne pas avoir fait de tests, mais je vais me faire confiance pour une fois (en me préparant a ramaser mes dents).


Déjà t'as un gros problème de conception : des liens sans urls, du polling pour détecter le changement de hash… Y'a pas photo, ça c'est naze.

faut que quelque part dans la onload de la page tu vérifies si y'a une url du type #page et charger la page en conséquence. Ensuite si tu veux que les boutons avant/arrière marchent (et implicitement ton F5), change location.href – au lieu de location.hash – avec URL+hash. l'url reste la même, seul le hash change donc la page ne sera pas rechargé.

Le chargement de la page tu le fais sur le onclick du lien pas vérifier les changements tous les 100ms, c'est pas malin. il va pas magiquement se modifier le hash.

Citation : nod_

Il va pas magiquement se modifier le hash.

Aah ? Qui sait !

Oui j'avais pas tout mis mais dans mon index.php j'ai ceci:

MAJPageviaHash()

Qui vérifie justement le changement de hash... Donc...

tu changes location.href, le location.hash est mis à jour comme il faut.

J'ai testé, pour faire court : j'ai raison, t'as tord.

Pff c'est pas marrant, comme si ça t'arrivait d'avoir tord

Citation : nod_

tu changes location.href, le location.hash est mis à jour comme il faut.

J'ai testé, pour faire court : j'ai raison, t'as tord.

Oui mais comment je fais çà
Désolé de mon inaptitude