11402 sujets

JavaScript, DOM et API Web HTML5

Pages :
(reprise du message précédent)

Après essai, il semble qu'il manque un } quelque part (la console me dit à la dernière ligne, mais c'est certainement autre part... Smiley biggol
ca marche au niveau syntaxique, meme si j'ai le regret de te dire que maintenant, la page ne s'affiche même plus Smiley sweatdrop

On va y arriver !

En tout cas, merci beaucoup pour l'aide personnelle que je bénificie de ta part !
Modifié par Sylvain (06 Sep 2005 - 17:28)
Un petit soucis qui n'a pas grand rapport, mais les pages inclusent n'ont pas d'accent.
Les accents sont remplacés par des ?.
Je ne sais pas si ca vient du code javascript ou autre, mais je pense, puisque ces pages marchent bien lorsquelle ne sont pas incluses...
ça, c'est interressant...

Il va falloir fixer l'encodage des pages incluses, et les fixer sous PHP à l'aide de

<?php header("Content-Type: text/html; charset=utf-8"); ?>
ou
<?php header("Content-Type: text/html; charset=iso-8859-1"); ?>


en étant sur au préalable de l'encodage réel des pages.

Deuxième point:
pour débugger l'importation des pages, il faudrait utiliser un des boutons inactif pour appeler une page
simple et bien identifiable, (avec des accents) et un div avec une bordure un peu épaisse. Tu visualiserais le résultat.
En effet, comme on intervient sur la hauteur de 'fond', si cette hauteur se trouve fixée par erreur à zero, on ne verrait rien. Mais avec une bordure, on verrait une ligne.
Garde toi la possibilité de désactiver la ligne qui agis sur le height pour vérifier que le reste marche: (en mettant deux slash)

[b]// [/b]document.getElementById('fond').style.height = document.body.scrollHeight + 'px';

(A ce propos, il faudra essayer sans "+ 'px'")


Troisième point :
document.documentElement, ça n'existe pas. C'est document.body...

(qu'est-ce qu'on est bête!!) Smiley ola

Référencement : quand on tape documentElement sur google, on tombe sur notre discussion. Smiley ravi

Bon courage
Modifié par GeorgesM (06 Sep 2005 - 09:08)
J'ai vu des choses :

Il y a encore un défaut dans la fonction qui utilise XmlHttpRequest.
Le send n'est pas bien placé. D'autre part, on ne fixe pas de header.


J'ai réecris quelquechose de plus léger, et plus facile à comprendre :
function sendData(page,div)
{
	var content = document.getElementById(div);
	
	if(document.all)
		var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
	else
		var XhrObj = new XMLHttpRequest();

	XhrObj.open("GET", page);

	XhrObj.onreadystatechange = function()
	{
		if (XhrObj.readyState == 4)
		{ 
			content.innerHTML = XhrObj.responseText;
[b]document.getElementById('fond').style.height = document.body.scrollHeight; // içi notre modification de hauteur[/b]
		} 
	}
[b]XhrObj.setRequestHeader("Content-Type", "text/xml; charset=utf-8");
	XhrObj.send(null);[/b]
} 



Comme les requettes sont en mode GET et qu'on n'envoie pas de données, on peu élaguer pas mal de if...
Modifié par GeorgesM (06 Sep 2005 - 17:39)
Merci beaucoup pour ce lien solo, et pour ton aide GeorgesM.
Je teste dès que je suis de retour chez moi (vers 17 heures)...
Modifié par Sylvain (06 Sep 2005 - 17:26)
@Georges:
Je trouvais aussi ce truc là assez bizarre, car il rendait mal avec le colorage du code dans mon éditeur...

Soucis: les pages ne s'importent plus.

La div, même sans hauteur, on la voit encore, puisque de toute facon il y a la grosse image de malle dedans.

Comme la page ne s'importe plus, je ne peux pas te dire si ca marche mieux pour notre div...

Le code source de mon javascript.js est actuellement:

function sendData(page,div)
{
var content = document.getElementById(div);

if(document.all)
var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
else
var XhrObj = new XMLHttpRequest();

XhrObj.open("GET", page);

XhrObj.onreadystatechange = function()
{
if (XhrObj.readyState == 4)
{
content.innerHTML = XhrObj.responseText;
document.getElementById('fond').style.height = document.body.scrollHeight; // içi notre modification de hauteur
}
}
XhrObj.setRequestHeader("Content-Type", "text/xml; charset=utf-8");
XhrObj.send(null);
}
function getFile(page){sendData('null', page, 'GET', 'cache')}
function description(page){sendData('null', page, 'GET', 'description')}


Firefox me dit, dans sa console:

La console de Firefox a écrit :
Erreur: content has not properties (ligne 16)


La ligne 16 que voici:

content.innerHTML = XhrObj.responseText;


Si on ne trouve pas ce n'est pas grave, j'ai eu l'idée de passer outre avec un position:fixed et une émulation pour internet explorer...
Néanmoins, c'est moins clean, je préfèrais la solution en javascript qui touche pas à mon CSS... Et je n'aime pas que quelque chose ne marche pas, et je préfère le faire fonctionner plutot que passer outre Smiley rale Smiley mur


@Solo:

Ton truc à l'air bien, mais trop bien pour moi, il fait trop de choses, or le fichier js que j'ai actuellement risque d'etre beaucoup sollicité, aussi, préférons les choses simples que les usines a gaz qui font tout, mais qui consomment beaucoup de bande passante !
Modifié par Sylvain (06 Sep 2005 - 17:27)
Oui, effectivement, il faut mettre à jour les fonctions appelantes : (moins de parametres)

function getFile(page){sendData( page, 'cache');}
function description(page){sendData(page,'description');}


(qu'est-ce que je suis bête!!) Smiley ola
Modifié par GeorgesM (06 Sep 2005 - 17:48)
bon, les accents remarchent avec ton header en php (je suis très bete aussi de ne pas y avoir pensé), et, tu l'auras deviné car j'ai testé les accents, la malle s'affiche !!!

cependant, la div n'est toujours pas à 100% de hauteur... en fait, elle n'a pas de hauteur définie, elle s'adapte en fonction de la hauteur de la malle
en effet...
je vais tester quelque chose (mettre un positionnement fixe pour firefox, et ca pour ie, si ca marche, alors on pourra 'enfin' mettre le résolu sur ce topic, et je pourrais te dire un énorme merci !
Et voilà, le tour est joué :

div[id]#fond{
position:fixed;
height:100%
}


Je te remercies beaucoup pour toute l'aide que tu m'as apporté !
A bientôt pour de nouvelles aventures (comprendre: de nouveaux problèmes) ! Smiley biggol
Il reste un petit bug dans le script...

document.getElementById('fond').style.height = document.body.scrollHeight;

est exécuté à chaque changement de page et va donc créer des erreurs quand 'fond' n'existe pas ou plus.

En attendant mieux, on doit faire:


if (document.getElementById('fond'))
{
document.getElementById('fond').style.height = document.body.scrollHeight;
}

pour éviter l'erreur.
Pages :