Notice : Undefined variable: index : in /ref/index.php on line 13
Warning : preg_replace(): Unknown modifier '(' : in /ref/index.php on line 53
Warning : preg_replace(): Unknown modifier '(' : in /ref/index.php on line 53
Warning : preg_replace(): Unknown modifier '(' : in /ref/index.php on line 53
Warning : Cannot modify header information - headers already sent by (output started at /core.php:20) : in /header.php on line 34
Warning : Cannot modify header information - headers already sent by (output started at /core.php:20) : in /header.php on line 35
Méthode showModalDialog -- Le Coin Web de QuentinC

Vous êtes ici : Accueil > Référence HTML et JavaScript > Objet Window > Méthode showModalDialog

Méthode showModalDialog

Description

Affiche une fenêtre de dialogue modale. Cette boîte de dialogue doit être fermée avant que la fenêtre mère puisse être à nouveau utilisée. Ne fonctionne qu'avec Internet Explorer 5+.

Syntaxe

* showModalDialog(String url, String param, String options)

Paramètres

  • String url : Adresse URL de la page à afficher dans la fenêtre
  • String param : Paramètres spéciaux à passer à la fenêtre de dialogue, peut également servir à fournir un nom pour celle-ci.
  • String options : les options de la fenêtre. Pour plus de détails, regardez la fonction open.

Valeur de retour

La valeur retournée et son type dépendent de la valeur de l'objet Window.returnValue de la fenêtre de dialogue au moment où celle-ci a été fermée. Vous allez voir plus bas comment échanger des informations entre fenêtre mère et boîte de dialogue modale.

Attention ! la valeur retournée ne correspond jamais à un objet Window représentant la fenêtre. Vous ne pouvez pas manipuler une fenêtre de dialogue modale comme vous le feriez pour un popup ouvert avec open.

Remarques

  • L'ouverture d'une fenêtre vierge (sans url) n'est pas autorisée et déclenche une "erreur non définie".
  • Cette fonction ne marche qu'avec Internet Explorer
  • Tant que la boîte de dialogue est ouverte, la fenêtre mère est inaccessible, et le script qui a ouvert la boîte de dialogue est "gelé" jusqu'à ce que la boîte modale soit fermée.

Exemple

Affichage d'une boîte de dialogue simple

L'exemple suivant affiche simplement la page d'accueil du site en tant que dialogue modale. Cette fenêtre se ferme facilement par la croix ou Alt+F4.

Exécuter le script

Echange d'informations entre fenêtre mère et boîte de dialogue

Internet Explorer permet de transmettre des informations entre la fenêtre mère et la boîte de dialogue, mais la façon de faire est complètement différente de celle qu'on utilise entre popup et fenêtre mère. La transmission de données entre fenêtre mère et boîte de dialogue se passe comme suit :

  1. Lors de l'ouverture de la boîte de dialogue, la fenêtre mère utilise le deuxième argument de la fonction showModalDialog pour transmettre des informations.
  2. La boîte de dialogue pourra récupérer les paramètres passés à showModalDialog grâce à la propriété dialogArguments.
  3. Avant de fermer la fenêtre de dialogue, on attribue une valeur à la propriété returnValue. Cette valeur de retour peut être de n'importe quel type : nombre, chaîne, tableau, objet...
  4. Le script de la page mère, qui était gelé pendant que la boîte de dialogue était ouverte, reçoie la valeur transmise par returnValue en tant que valeur de retour de showModalDialog.

Voici, en pratique, comment procéder. Le script suivant permet de modifier la couleur d'un paragraphe de texte.

Première partie : la fenêtre mère

Voici ci-dessous le code qui appelle la fenêtre de dialogue :


Deuxième partie : La page HTML qui fera office de boîte de dialogue

Voici ci-dessous le code HTML de la page ex-setcolor.html, page qui sera utilisée dans la boîte de dialogue.

Le résultat final

Cliquez sur le lien pour modifier la couleur de ce paragraphe de texte.

Modifier la couleur du paragraphe de texte ci-dessus

Vous êtes ici : Accueil > Référence HTML et JavaScript > Objet Window > Méthode showModalDialog

Dernière modification de cette page : Mardi 4 avril 2006 07:13
Haut de page  •  Contact  •  RSS  •  Valide XHTML 1.0