[AJAX] afficher un cadre au premier plan

Version imprimable

23/07/2009, 09h50
ledisciple

[AJAX] afficher un cadre au premier plan

Bonjour !!!

Je me tourne vers vous en dernier espoir.

Je ne connaissais pas (et j'en connais pas plus) ajax et Javascript.

Sur mon site, je voulais faire apparaître une nouvelle fenêtre (plus exactement un cadre) en premier plan au moyen d'un clique et pouvoir aussi le fermer. ex( le "test it de cette page http://prototype-window.xilinus.com/)

Pour cela, j'ai utiliser ceci le fichier page.html et le fichier css pour le style

Tout marche nickel, sauf que la page se recharge totalement. Pour éviter que cela se produise on m'a conseillé de venir vers vous. Je me suis pas mal documenté et je sais qu'il faut 3 fichiers ( html javascript php)
J'aimerai savoir comment lancer ma fameuse fenêtre de la façon la plus simple possible ...

merci de votre patience
23/07/2009, 10h48
andry.aime

Bonjour,
On peut voir le code qui ouvre la nouvelle fenêtre.
D'après le lien que tu as donné on doit ouvrir un fenêtre avec ajax avec:
setAjaxContent(url, options, showCentered, showModal),
Je pense que tu ouvres la fenêtre avec un lien sans return false.
23/07/2009, 11h00
ledisciple

Citation:

Envoyé par andry.aime

Bonjour,
On peut voir le code qui ouvre la nouvelle fenêtre.
D'après le lien que tu as donné on doit ouvrir un fenêtre avec ajax avec:
setAjaxContent(url, options, showCentered, showModal),
Je pense que tu ouvres la fenêtre avec un lien sans return false.

merci pour ta réponse

J'ouvre ma fenêtre avec une variable qui va chercher le style pour afficher / cacher la fenêtre.

Code:

<a href="cadre.php?style=haut">

pour plus de précision niveau code, je l'ai attaché comme page.php
23/07/2009, 12h16
andry.aime

Je parle du code javascript et/ou ce qui se trouve dans la balise xmp.
23/07/2009, 13h05
ledisciple

Citation:

Envoyé par andry.aime

Je parle du code javascript et/ou ce qui se trouve dans la balise xmp.

justement, j'en ai pas encore ... la solution php/css était suffisante. Mais si j'ai envie d'ouvrir une fenêtre sans recharger la page il va m'en falloir une, je crois ...
23/07/2009, 13h11
andry.aime
Essaie avec:
dans le head:
Code:

1 2 3 4 5 6 7 <script type="text/javascript"> function afficher() { Dialog.alert({url: "cadre.php?style=haut", options: {method: 'get'}},{width:540, okLabel: "Fermer"}); } </script>
Code:

<a href="cadre.php?style=haut" onclick="afficher(); return false;">Lien</a>

Il faut inclure les fichiers nécessaires que tu téléchargeras sur le lien que tu as donné.
23/07/2009, 17h41
ledisciple

Désolé

Désolé, ma page se recharge toujours... :roll:

j'ai fouillé un peu avec le code que tu m'as donné. :google:

pour plus de clarté dans ma demande j'ai touvé un autre site :

http://code.kolmio.com/jsdialog/Docs/Dialog.alert.html

J'aimerai savoir comment l'exemple 1 est fabriqué pour que je puisse à la place du bouton placer un lien avec mes variables afin d'afficher le document de la requête (placer plus haut dans mon code)

Merci beaucoup d'avance ...
24/07/2009, 08h06
andry.aime

Salut,
C'est une autre librairie que celui que tu as demandé sur ton premier post,
la documentation du code que j'ai donné se trouve sur:
http://prototype-window.xilinus.com/documentation.html
Tu trouves aussi des exemples dans la rubrique sample et voir ces codes sources.

Citation:

Désolé, ma page se recharge toujours...

As-tu inhibé le lien avec un return false?
On peut voir ton code?

heu, j'ai pas dis, je suis débutant ...

Je commence un peu à comprendre le truc, tu me dis si je me trompe ... :? j'ai pris un exemple plus simple ...

Début :

Code:

1
2
3
4
5
6
7
8
9
10
 
<head>
 <script type="text/javascript">
		function afficher()
		{
		Dialog.alert({url: "bla.html", options: {method: 'get'}},{width:540, okLabel: "Fermer"});
		}
</script>
</head>
<body>

là par contre pourquoi il y a deux liens vers des .js?

Code:

1
2
<script type="text/javascript" src=".../prototype.js"> </script>
<script type="text/javascript" src=".../javascripts/window.js"> </script>

il faut que je mette ça dans quel fichier?

Code:

1
2
3
4
win = new Window({className: "mac_os_x", title: "Sample", width:200, height:150, destroyOnClose: true, recenterAuto:false});
 
win.getContent().update("<h1>Hello world !!</h1>");
win.showCenter();

Fin du fichier :

Code:

1
2
3
4
5
6
 
<!-- là je met ma feuille de style --> 
<link href="/stylesheets/themes/default.css" rel="stylesheet" type="text/css"/>
 
<a href="#" onclick="afficher(); return false;">Lien</a>
</body>

Je suis désolé, mais je suis débutant. j'ai bien essayé les tutos, mais ...