begin process at 2012 05 28 13:29:40
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Trucs & Astuces

 > DIALOGUE ENTRE FENÊTRES MÈRE ET FILLE

DIALOGUE ENTRE FENÊTRES MÈRE ET FILLE


 Information sur la source

Note :
9,33 / 10 - par 3 personnes
9,33 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Trucs & Astuces Classé sous :Dialogue, Echange, Fenêtre, Mère-Fille Niveau :Débutant Date de création :28/09/2011 Vu / téléchargé :2 684 / 283
Auteur : william voirol

Ecrire un message privé
Site perso
Commentaire sur cette source (4)
Ajouter un commentaire et/ou une note

 Description

J'ai perdu beaucoup de temps à trouver sur le web les différents manières de dialoguer entre fenêtres.
Voici un petit exemple qui montre comment on peut le faire assez simplement.
Le principe est le suivant: il faut disposer de la référence aux objets 'Window' concernés.
Dans la fenêtre mère, il faut la retenir dans une variable avec une instruction de la forme:
   win = open(...)
et dans la fenêtre fille, on l'a directement dans la propriété 'opener' (de l'objet 'Window' local).
On peut alors accéder directement aux variables et fonctions globales de ces objets.

Le test rudimentaire proposé ne fait pas la gestion de plusieurs fenêtres filles: le dialogue y est limité à la dernière ouverte.

Le test à l'air de bien fonctionner avec  IE, Firefox, Google Chrome, Opera et Safari. Attention: avec Google Chrome, il faut que les fichiers html se trouvent sur un 'Serveur' (problème en 'local').

Source

  • *************fichier 'index.html'
  • <!DOCTYPE html>
  • <html>
  • <head>
  • <title>Fenêtre mère</title>
  • <meta name='Author' content='William VOIROL, Switzerland, Oct 2011'/>
  • <script type="text/javascript">
  • var win,num=0,secret='Secret de la mère ...';
  • function GetM(txt) {document.getElementById('zon').innerHTML=txt;}
  • function OpenW() {win=open('fille.html','','height=300,width=464,menubar=0');}
  • function SendM() {win.GetMes('Message n°'+(++num)+' de la fenêtre mère')}
  • function Avis() {document.getElementById('zon').innerHTML=win.avis}
  • </script>
  • </head>
  • <body style='background-color:yellow;'>
  • <div>
  • <input type='button' onclick='OpenW()'value='Ouvrir une fenêtre fille'/><br/><br/>
  • <input type='button' onclick='SendM()'value='Envoyer un message à la fille'/><br/><br/>
  • <input type='button' onclick='Avis()'value='Lire la variable "avis" de la fille'/><br/><br/>
  • </div>
  • <div id='zon' style='background-color:white'>Massages:</div>
  • <div><br/><a href='http://www.william-voirol.ch/Prog/Tests/Dialog.zip'>Zip du code</a></div>
  • </body>
  • </html>
  • *************fichier 'fille.html'
  • <html>
  • <head>
  • <title>Fenêtre fille</title>
  • <meta name='Author' content='William VOIROL, Switzerland, Oct 2011'/>
  • <script type='text/javascript'>
  • var num=0,avis='Avis de la fille ...';
  • function GetMes(txt) {document.getElementById('zon').innerHTML=txt}
  • function SendMes() {opener.GetM('Message n°'+(++num)+' de la fenêtre fille')}
  • function Secret() {document.getElementById('zon').innerHTML=''+opener.secret}
  • function SendD() {
  • opener.GetM('Prénom: "'+document.getElementById('pre').value
  • +'" &nbsp; &nbsp; Nom de famille: "'+document.getElementById('fam').value+'"')
  • }
  • </script>
  • </head>
  • <body style='background-color:#CCCCCC'>
  • <div>
  • <input type='button' onclick='SendMes()'value='Envoyer un message à la mère'/><br/><br/>
  • <input type='button' onclick='Secret()'value='Lire la variable "secret" de la mère'/><br/><br/>
  • <input type='text' id='pre' style='width:200px'/> Prénom<br/>
  • <input type='text' id='fam' style='width:200px'/> Nom de famille &nbsp; &nbsp; &nbsp;
  • <input type='button' onclick='SendD()'value='Envoyer'/><br/><br/>
  • </div>
  • <div id='zon' style='background-color:white'>Messages:</div>
  • </body>
  • </html> 
*************fichier 'index.html'

<!DOCTYPE html>
<html>
<head>
   <title>Fenêtre mère</title>
   <meta name='Author' content='William VOIROL, Switzerland, Oct 2011'/>
   <script type="text/javascript">
     var win,num=0,secret='Secret de la mère ...';
     
     function GetM(txt) {document.getElementById('zon').innerHTML=txt;}
    
     function OpenW() {win=open('fille.html','','height=300,width=464,menubar=0');}

     function SendM() {win.GetMes('Message n°'+(++num)+' de la fenêtre mère')}
      
     function Avis() {document.getElementById('zon').innerHTML=win.avis}
   </script>
</head>
<body style='background-color:yellow;'>
   <div>
      <input type='button' onclick='OpenW()'value='Ouvrir une fenêtre fille'/><br/><br/>
      <input type='button' onclick='SendM()'value='Envoyer un message à la fille'/><br/><br/>
      <input type='button' onclick='Avis()'value='Lire la variable "avis" de la fille'/><br/><br/>
   </div>
   <div id='zon' style='background-color:white'>Massages:</div>
   <div><br/><a href='http://www.william-voirol.ch/Prog/Tests/Dialog.zip'>Zip du code</a></div>
</body> 
</html>


*************fichier 'fille.html'

<html>
<head>
   <title>Fenêtre fille</title>
   <meta name='Author' content='William VOIROL, Switzerland, Oct 2011'/>
   <script type='text/javascript'>
      var num=0,avis='Avis de la fille ...';
      
      function GetMes(txt) {document.getElementById('zon').innerHTML=txt}
    
      function SendMes() {opener.GetM('Message n°'+(++num)+' de la fenêtre fille')}
      
      function Secret() {document.getElementById('zon').innerHTML=''+opener.secret}

      function SendD() {
         opener.GetM('Prénom: "'+document.getElementById('pre').value
            +'" &nbsp; &nbsp; Nom de famille: "'+document.getElementById('fam').value+'"')
      }
   </script>
</head>
<body style='background-color:#CCCCCC'>
   <div>
      <input type='button' onclick='SendMes()'value='Envoyer un message à la mère'/><br/><br/>
      <input type='button' onclick='Secret()'value='Lire la variable "secret" de la mère'/><br/><br/>
      <input type='text' id='pre' style='width:200px'/> Prénom<br/>
      <input type='text' id='fam' style='width:200px'/> Nom de famille &nbsp; &nbsp; &nbsp;
      <input type='button' onclick='SendD()'value='Envoyer'/><br/><br/>
   </div>
   <div id='zon' style='background-color:white'>Messages:</div>
</body> 
</html>

 Conclusion

Beaucoup d’exemples du web proposent de créer un tag invisible tel que <input id=’zut’>, et d'y accéder à l'aide de
   win.document.getElementById('zut').value
Il me semble que l'accès aux variables et fonctions globales est plus simple et plus général.
En effet, on ne se limite pas seulement à l'échange de donnés, mais on peut demander à une autre fenêtre d'accomplir une tâche.

Faites directement un test: (observez la remarque ci-dessous)
   http://www.william-voirol.ch/Prog/Tests/Dialog
Rem arque: de temps en temps, des espaces (caractères blancs) s'immiscent
dans certains textes. (CodeS-SourceS est au courant du problème).
Si c'était le cas ici, enlevez les espaces avant d'utiliser l'adresse Web ci-dessus.

L'exemple complet se trouve sur le fichier zip (3 Ko).

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Sources du même auteur

Source avec Zip Source avec une capture ONGLETS ET CHANGEMENT INSTANTANÉ DE LA LANGUE
Source avec Zip Source avec une capture RÉSOLUTION D'UN SYSTÈME D'ÉQUATIONS LINÉAIRES À N INCONNUES
Source avec Zip VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES
Source avec Zip ROTATION D'UNE IMAGE, ANIMATION
Source avec Zip FRACTALES, FOUGÈRE, TRIANGLE, CARRÉ
Toutes les sources de william voirol

 Sources de la même categorie

PARSER LES CARACTÈRES HTML D'UNE STRING par jdmcreator
CONSTRUCTION D'UNE TABLE TRIABLE À PARTIR D'UN TABLEAU 2D par phm
Source avec Zip Source avec une capture SUBDIVISER LE RÉSULTAT D'UNE RECHERCHE EN PAGES par kimmp
Source avec Zip TIMER : SETTIMEOUT & SETINTERVAL AMÉLIORÉS par jdmcreator
Source avec Zip Source avec une capture ONGLETS ET CHANGEMENT INSTANTANÉ DE LA LANGUE par william voirol
Toutes les sources de la catégorie Trucs & Astuces

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture BOITE DE DIALOGUE MODALE DE SÉLECTION D'UNE LISTE D'ICONES par JJDai
Source avec Zip Source avec une capture BOITE DE DIALOGUE (AVEC GRISEMENT DE LA PAGE) par nicomilville
Source avec Zip MESSAGE PERSONNALISER par SebMoine
Source avec Zip Source avec une capture PERSONNALISER LES BOÎTES DE DIALOGUE par XtremDuke
Source avec Zip PASSATION DE VALEURS ENTRE FENÊTRES HTML par vaniweb

Commentaires et avis

Commentaire de MacGaliver le 30/09/2011 11:11:26

Bonjour,

Bon départ, mais je trouve que serait mieux dans le cas où le message s'enregistrerait (mais il faudrait un ActiveX sous fichier hta de préférence).

Note: Si vous débutez en informatique j'avoue que c'est pas facile (je suis aussi passé par là)

;) Cordialement.

Commentaire de webdusud le 03/10/2011 10:59:54 9/10

très clair et pédagogique.
merci pour ce beau petit code !
Personnellement, pas la peine d'aller plus loin, à chacun de voir si un enregistrement de message serait utile.

Commentaire de Moktezuma le 03/10/2011 12:50:30 10/10

Excellent bout de code !!

C'est exactement ce qu'il me fallait pour améliorer un petit site que je développe :)
Je prends ton .zip et je verrais ce soir l'adaptation.

Pour le problème d'enregistrement, je ne vois pas vraiment ce que MacGaliver veut dire, mais en ce qui me concerne, je pense le couplé à un bout d'Ajax.
Bref, merci :D

Commentaire de ben2marseille le 03/10/2011 13:29:37 9/10

Bonjour,
merci pour ce programme qui me rendra bien service tel qu'il est.
Bonne continuation.

Benali

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Dialogue entre 3 fenêtres [ par Denis974 ] Bonjour,J'ai une première fenêtre(f1) qui en ouvre une seconde(f2), la seconde(f2) ouvre elle aussi une troisième fenêtre(f3) puis se ferme.Il me rest fonction onblur differente IE / firefox [ par floben21 ] Bonjour,J'ai un souci avec la fonction onblur:J'ai un document flash à l'interieur de mon html, qand je clique sur un bouton du flash (telecharger), [?]comment connaître l'état de focus d'une fenêtre [?] [ par lapoisse ] J'utilise les évènements onfocus et onblur pour détecter tout changement d'état de ma fenêtre mais pendant le chargement de ma fenêtre il se peut qu' Fermeture de fenêtre enfant [ par jpastier ] Bonjour à tous,J'ai développer une page mère où des liens ouvrent des popups.Au bout d'un certain temps d'inaction, la page mère retourne à la fenêtre Changer la valeur d'une variable dans la page parent à partir de la page enfant [ par jpastier ] Bonjour à tous,J'aimerais savoir s'il est possible de changer une variable dans la fenêtre parent à partir d'une fenêtre enfant.Exemple :- j'ouvre une Collection de fenêtres ? [ par FrLeMa ] J'ouvre une fenêtre-fille indépendante (target="_blank"), mais j'aimerai faire un lien de retour vers la fenêtre-mêre, en testant au préalable son exi Enlever la barre d'état ( barre du bas du navigateur) dans une fenêtre popup ? [ par rem78 ] Bonjour,Je voudrais arriver à retirer la barre d'état dans une fenêtre popup car deuis la mise à jour de SP2 de windows XP, j'aila barre d'état ( barr impression dans une autre fenêtre et sélection [ par mlelorra ] BonjourJ'ai une page html contenant un tableau de 20 colonnesJ'aimerais qu'il y ait un bouton ouvrant un petit pop-up (ou une petite fenêtre) qui fera fermer une fenetre automatiquement [ par jeanpasse ] Bonjour à tousJ'ai fait (copié) un petit script qui ne fait qu'ouvrir un menu dans une fenêtre aux dimensions voulues.Voici ce script: &lt;html&gt;&lt Pour afficher "Fermer la fenêtre" d'1 popup [ par JLB59 ] Bonjour à tous,J'ai vu plusieurs fois que des fenêtre popup comportait un lien "Fermer cette fenêtre".QQ& pourrait me dire où je peux trouver le scrip


Nos sponsors


Sondage...

Comparez les prix


Apple iPhone 4 Noir (32 Go)
Entre 1290€ et 1333€

Visiter le guide achat

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

Photo Waterfall in Kauai Hawaii With RainbowPhoto Beautiful El Capitan Yosemite National Park
Photo Houseboat tour through the backwaters of Kerala, India 

Visiter la photothèque

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 2,870 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)