Appel en Javascript avec paramètres vers Php

Marsh Posté le 18-12-2007 à 10:47:36

Bonjour

Je veux appeller une CSS en lui passant une variable calculée en Javascript par une fonction width().

Ce code n’appelle pas la CSS :

Code :

En JS: document.write('<link rel="stylesheet" href="style00.php?parm1=' + width() + '" media="screen" />');

et pourtant la valeur calculée par width existe et est correcte.

Ce code appelle correctement la CSS mais avec une valeur fixe :

Code :

<link rel="stylesheet" href="style00.php?parm1=1200" media="screen" />
En JS: document.write('<link rel="stylesheet" href="style00.php?parm1=1200" media="screen" />');

Conclusions:
- la CSS existe et peut être appellée
- l'appel ne fonctionne pas en passant la variable

Ai-je une erreur de syntaxe JS?
L’interpreteur JS de mon hébergeur est-il en cause ?

Merci par avance de vos suggestions et de votre aide.

Francois

Reply

Marsh Posté le 18-12-2007 à 10:47:36

Reply

Marsh Posté le 18-12-2007 à 13:19:29

olala!

Essaye:

Code :

alert('<link rel="stylesheet" href="style00.php?parm1=' + width() + '" media="screen" />');

Tu y verra mieux, je pense.

je dis "olala!" à cause de cette phrase:
"L’interpreteur JS de mon hébergeur est-il en cause ?"
Non, certainement pas puisque l'interpréteur JS est sur ton navigateur.

Enfin, tu calcule la largeur de l'écran en pixels, quand tu fait ça tu peux être sûr à 100% que ton site ne passera pas sur tous les médias. Il sera joli sur ton écran à toi qui a servi a testé le site. Fo utiliser les pourcentages, c'est à ça que ça sert.

Reply

Marsh Posté le 18-12-2007 à 13:21:17

Cela devrait marcher, mais :

- Le nom de la fonction, "width", est mal choisi car il peut être confondu avec un mot réservé.
- Si la valeur retournée par la fonction est un nombre, alors il faut le convertir en chaine de caractères par String()

Message cité 1 fois

Reply

Marsh Posté le 18-12-2007 à 13:35:50

olivthill a écrit :

Cela devrait marcher, mais :

- Le nom de la fonction, "width", est mal choisi car il peut être confondu avec un mot réservé.
- Si la valeur retournée par la fonction est un nombre, alors il faut le convertir en chaine de caractères par String()

non non, c bon: 'mon ' + 1 + 'er site' -> 'mon 1er site'
par contre: 'mon ' + (1+1) + 'eme site' -> 'mon 2eme site'

Reply

Marsh Posté le 18-12-2007 à 13:43:50

bonjour

J'ai essayé avec String() mais ça n'a rien changé.

D'ailleurs, j'ai déjà appellé du Php en lui passant des paramètres de cette manière, sans formater avec String() ou autre.

Par contre, l'appel était avec Href, jamais avec Link jusqu'ici.

Link aurait-il une limitation?

Francois

Reply

Marsh Posté le 18-12-2007 à 13:58:49

Comme l'indique olivthill, change le nom de la fonction 'width'.
Relis ton code attentivement, soit la fonction width que tu appelle n'est pas la bonne, soit elle retourne une valeur fixe. Poste le code de la fonction width.
Il n'y a pas de limitation particulière au tag Link.

Reply

Marsh Posté le 18-12-2007 à 14:05:17

Autre piste: ce peut être le script PHP qui ne tient pas compte de la valeur passée en paramètre...

Reply

Marsh Posté le 18-12-2007 à 14:12:32

bonjour

Voila mon code JS:

Code :

<script language="JavaScript" type="text/javascript">
function widthtoto()
{
if (window.innerWidth)
{
widtha = window.innerWidth;
}
else if (document.documentElement && document.documentElement.clientWidth)
{
widtha = document.documentElement.clientWidth;
}
else if (document.body)
{
widtha = document.body.clientWidth;
}
return(widtha);
}
document.write('<link rel="stylesheet" href="style00.php?parm1=' + widthtoto() + '" media="screen" />');

Je récupère ça dans style00.php avec $_GET['parm1'].

Aussi, je teste ça en IE7; pourrait-il y avoir un pb de navigateur?

Francois

Reply

Marsh Posté le 18-12-2007 à 15:30:29

attends, je crois avoir pigé, ajoute:
type="text/css"
à la balise link, et dans le script php-css, ajoute un
header('content-type: text/css')
Enfin, vérifie que la balise <link> soit bien entre les balises <head> ... </head>.

Reply

Marsh Posté le 18-12-2007 à 16:35:14

J'ai:
- ajouté type="text/css" dans le Link
- vérifié que j'avais bien header('content-type: text/css') dans style00.php
- le Link est bien dans le Head

mais ça ne fonctionne tjs pas.

Aïe.

Francois

Reply

Marsh Posté le 18-12-2007 à 16:35:14

Reply

Marsh Posté le 18-12-2007 à 16:52:34

Je viens de faire un essai avec:

Code :

function widthtoto()
{
widtha = 1024;
return(widtha);
}

et ça a donné le résultat négatif habituel.

Donc, même en éliminant un éventuel pb de calcul de la valeur, l'appel ne se fait pas correctement.

Au besoin:
- mon URL: http:cegvh1.free.fr/
- la CSS: style00.php

Merci de ton aide.

Francois

Reply

Marsh Posté le 18-12-2007 à 17:03:15

Tu as une erreure dans ton script:
http://cegvh1.free.fr/style00.php?param1=1024
ça ne marchera donc pas.

En plus, quand je regarde les informations de la page, il est indiqué:
type: text/html
Pour éviter ça, ajoute:

Code :

header('content-type: text/css');

tout au début du script PHP (lis la doc de cette fonction sur http://php.net/header ). Sinon, le navigateur traite ton style CSS comme une page html.

Edit: la fonction widthtoto semble fonctionner sous FF, pas testé sous d'autres navigateurs, mais à vue de nez c correct.

Message édité par nargy le 18-12-2007 à 17:04:59

Reply

Marsh Posté le 18-12-2007 à 17:19:40

Les premières lignes de style00.php:

Code :

<?php
/* reprise en PHP des variables HTML */
$width=$_GET['parm1'];
$reducteur1 = 5;
$widthimage = floor($width/$reducteur1);
$reducteur2 = 3/2;
$heightimage = floor($widthimage/$reducteur2);
// source: http://sperling.com/examples/pcss/>
header("Content-type: text/css" );
$couleurfond = "#D5E9D7";
...
...

si ça peut être utile.

Francois

Reply

Marsh Posté le 18-12-2007 à 17:30:09

je viens de tester cette page:

Code :

<html>
<script>
document.write('<link rel=stylesheet href="http://cegvh1.free.fr/style00.php?param1=1024">');
</script>
<body>
Hello
</body>
</html>

et ça fonctionne.

Ce qu'il reste comme erreure provient de ton javascript, dans lequel tu y as mis des commentaires HTML  un peu n'importe où.
Il faut faire comme ça pour HTML4Transitionnal avec un max de compatibilité:

Code :

<script type="text/javascript" language="JavaScript">
<!--
// placer tout le code JS ici, sans commentaires HTML, se méfier aussi des chaines JS contenant des commentaires HTML comme par exemple la flèche '->' longue avec deux tirets
// -->
</script>

Message édité par nargy le 18-12-2007 à 17:31:59

Reply

Marsh Posté le 18-12-2007 à 17:41:41

Oui, tout à fait juste, j'avais mis des commentaires erronés.

Avec cet appel et une valeur fixe produite par width, l'appel fonctionne, d'accord avec toi.

Maintenant, quand je remet le calcul de la valeur width, ça ne fonctionne plus.

J'ai la conviction que la valeur passée est nulle, faute pour le calcul d'avoir trouvé une valeur d'origine parmi les 3 prises en compte.

Aïe.

Francois

Reply

Marsh Posté le 18-12-2007 à 17:45:36

Pour vérifier cette hypothèse, utilise ce truc:

Code :

window.alert('<link rel="stylesheet" href="style00.php?parm1=' + widthtoto() + '" media="screen" />');

Celà fait apparaître une boîte d'alerte javascript avec un message dedans. Très pratique pour voir exactement ce que vaut une chaîne JS.

Edit: Ces lignes:

Code :

if (window.innerWidth)
{
widtha = window.innerWidth;
}

fonctionnent toujours avec les navigateurs compatibles DOM (IE6/7, moz/firefox entre autre).

Message édité par nargy le 18-12-2007 à 17:47:58

Reply

Marsh Posté le 18-12-2007 à 17:49:59

Oui, j'avais mis un Alert, dans le Body, et la valeur produite par Width était correcte.

L'idée sur laquelle je suis là maintenant est que width() produit une valeur vide, faut d'avoir trouvé ses données de base de calcul (document.body, ...).

Si ça t'inspire.

Francois

Reply

Marsh Posté le 18-12-2007 à 17:56:40

Ok, il reste des commentaires HTML mal placés dans le JS.
Ha non, ça marche maintenant.
Tu peux ajouter en dessous du copyright un remerciement à forum.hardware.fr

Reply

Marsh Posté le 18-12-2007 à 17:58:28

Mon problème est si difficile à identifier / corriger que je mettrai un remerciement à tous ceux, comme toi, qui y auront contribué.

Merci encore de tes efforts, même si ça ne fonctionne pas encore.

Francois

Reply

Marsh Posté le 18-12-2007 à 18:10:42

Bah il y avait deux problèmes différents en fait: le type text/css et les commentaires dans le JS. Tu devrais t'en sortir maintenant. Bonne continuation.

Reply

Marsh Posté le 18-12-2007 à 18:13:55

Oui, j'espère, j'ai tjs une valeur vide pour document.body.

Merci de ton aide.

Francois

Reply

Marsh Posté le 18-12-2007 à 18:58:51

Et pourquoi pas appeler ma CSS deux fois, une fois dans le Head pour tout ce qui est fixe et une autre fois, juste après le Body, pour tout ce qui est variable?

J'ai essayé, ça a bonne mine.

Qu'en penses tu?

Francois

Reply

Marsh Posté le 18-12-2007 à 19:25:57

Ce serait surtout une bonne idée de séparer le CSS statique de la page et le CSS dynamique.
Le tag Link se mets toujours dans le head. Idem pour les définitions de style et les scripts JS. Même si les navigateurs sont souples avec cette norme.

Or document.body est en effet non défini au moment du chargement du HEAD de la page.

Le compromis possible: ajouter un tag 'style' (minimaliste) juste au début de body.

Reply

Marsh Posté le 18-12-2007 à 19:40:50

J'adhère absolument à ce que tu dis, tellement que je vais le faire.

Merci de ton aide.

Francois

Reply

Marsh Posté le

Reply

Appel en Javascript avec paramètres vers Php

Sujets relatifs:

Leave a Replay