Un probleme avec une popup

Version imprimable

Voir 40 message(s) de cette discussion en une page

03/02/2006, 10h11
SpaceFrog

heu tu sais pas juste faire une page html ???
mon idée était d'avoir une page html dans le repertoire et tu appelles cette page modèle dans le popup en modifiant juste l'innerHTML du div ...
03/02/2006, 10h20
snoups58

oui mais comment tu fait pour appeler cette page html ?? et comment tu peut généré du code dedans a partir de la page principal
03/02/2006, 10h24
SpaceFrog

ben ????

Code:

var dow = window.open('mapagemodele.htm', 'popup', 'resizable=no, toolbar=no');
03/02/2006, 10h28
snoups58

sa c pour l'ouvrir ??

POur mettre du code c pareil k'avec la popup simple ?

Code:

dow.document.write("<TITLE>Aperçu Devis</TITLE.....

NON ???
03/02/2006, 10h37
SpaceFrog

ben non la tu n'as plus besoin d'ecrire le titre puisqu'il sera déja dans la page ????
tu modifies juste l'innerHTML.....

ou alors si tu veux aussi modifier le titre tu le fais aussi avec

Code:

getElementsBuyTagName('title').innerHTML
03/02/2006, 10h41
snoups58

en fait je fait toute ma page HTML stantard et ensuite je met mon document.getElementById('text4').innerHTML !!

Mais comment je le met dans ma pag HTML annexe !!

( dsl d'etre ossi chiant mais c super important )

à mon avis c'est juste un détail qui t'echappe ...

la page principale:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
<script type='text/javascript'>
function popup(){
var dow = window.open("modele.htm","modele", "resizable=no, toolbar=no, scrollbars=no, location=no, width=200, height=200, top=100, left=100");
setTimeout(function(){dow.document.open();
						 dow.document.getElementById('conteneur').innerHTML=document.getElementById('text4').value
						 dow.document.close();
						 },3000)
}
</script>
 
</head>
 
<body>
<input name='apercu' id='apercu' class='bouton' value='Aperçu du DEVIS pour impression' type='button' onClick='javascript:popup();'>
<input type='text' id='text4' />
 
</body>
</html>

la page modele.htm :

Code:

1
2
3
4
5
6
7
8
9
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Mon Popup</title>
</head>
<body style='background-color:silver;margin:5px;'>
	<div id="conteneur" style="border:solid 1px gray;height:100%;width:100%;"></div>
</body>
</html>

03/02/2006, 11h20
snoups58

je v tester sa !! mici de ta patience !! ;)

mais en fonction de la vitesse de connection il peut y avoir un problème d'order d'instanciation des objets ...
que je te propose de résoudre comme suit :

la page principale ne fait qu'ouvrir la page modèle ...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
<script type='text/javascript'>
function popup(){
var dow = window.open("modele.htm","modele", "resizable=no, toolbar=no, scrollbars=no, location=no, width=200, height=200, top=100, left=100");
}
</script>
 
</head>
 
<body>
<input name='apercu' id='apercu' class='bouton' value='Aperçu du DEVIS pour impression' type='button' onClick='javascript:popup();'>
<input type='text' id='text4' />
 
</body>
</html>

la page modèle se remplit toute seule sur le onload :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Mon Popup</title>
<script type='text/javascript'>
function populate(){
document.getElementById('conteneur').innerHTML=window.opener.document.getElementById('text4').value;
}
</script>
 
</head>
<body style='background-color:silver;margin:5px;' onload="populate()">
	<div id="conteneur" style="border:solid 1px gray;height:100%;width:100%;"></div>
</body>
</html>

03/02/2006, 11h32
snoups58

voila ce que le deboggeur me dit : dow.document.getElementById('conteneur') has no properties
03/02/2006, 11h45
SpaceFrog

je pense que nos posts se sont croisés ...
c'est justement ce que je disais à propos de la rapidité d'ouverture si tu conserve le code dans la page mère ...
il tente de remplir un div qui n'est pas encore créé !!!

Si parcontre comme dans mon précédent post le script est basculé dans la popup ou appelé depuis le onload de la page dans le popup tu n'auras plus ce souci quelleque soit la lenteur de connection puisque l'objet sera toujours instancié au moment de son appel ...

g essayer les deux marche po :?

pas d'erreur debogeur juste rien qui s'affiche :?

je vais te faire voir tout le script correspondant pour ke tu comprenne mieux!!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<div id="text3" class="invisibletext">
<div align="left"> 
			<p class="texte">Dans cette étape veuillez saisir une date désignant le jour où la manifestation aura lieu ainsi que le lieu !</p><br>
          <p class="texte">ATTENTION la date doit etre impérativement noter sous la forme JJ/MM/AAAA c'est à dire que pour le 4 Février il faudra noter 04/02/AAAA !!!!</p><br>
         <p align="center"><br>
            Date de la manifestation *: 
            <input id="datemanif" type="text" class="champ" value="jj/mm/aaaa" size="10" maxlength="10">
            <br>
            Lieu de la manifestation : 
            <input id="lieu" type="text" class="champ" size="30" maxlength="200">
			<br>
			Titre de la manifestation :
			<input id="titreanim" type="text" class="champ" size="30" maxlength="200">
          </p><br>
		  <p class="texte">La prochaine étape est un aperçu de votre devis que vous pouvez imprimer pas le lien qui se trouvera tout en bas !</p>
        </div>
</div>
 
<div id="text4" class="invisibletext">
<img src="images/logoanim.GIF">
<span id="partie1"></span>
<span id="partie2"></span>
<span id="partie3"></span>
<span id="partie4"></span>
<span id="partie5"></span>
<input type"button" class="bouton" onClick="popup()">
</div>
 
<div id="text5" class="invisibletext">

sa c ma page principale !! je gere 5 div afficher au fur et à mesure par des fonctions

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function prece()
{
	document.getElementById("text" + noetape ).className='invisibletext';
	noetape-=1;
	document.getElementById("text" + noetape ).className='visibletext';
	document.getElementById("imgetape").src="/images/etape/etape" + noetape + ".bmp";
	precedent.className='boutonvisible';
	if ( noetape == 4 ) 
	{
		suivant.className='boutonvisible';
		confirmation.className='boutoninvisible';
	}
	if ( noetape == 0 )
	{
		precedent.className='boutoninvisible';
	}
}

Mon code java pour un clicke sur précédent !!
c pas tres joli comme code mais il marche ;)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
function suiv()
{
	var pastype=0 , pasnom=0 , pastel=0 , pasadr=0 , pascp=0 , pasville=0, pasmail=0;
 
	if (noetape==0)
	{
		document.getElementById("text" + noetape ).className='invisibletext';
		noetape+=1;
		document.getElementById("text" + noetape ).className='visibletext';
		document.getElementById("imgetape").src="/images/etape/etape" + noetape + ".bmp";
		precedent.className='boutonvisible';
	}
	else if (noetape==1)
	{
.......
/// mes test entre chaque passage 
.......
 
else if ( noetape == 3 )
	{if ((document.getElementById("datemanif").value=="")||(document.getElementById("datemanif").value=="jj/mm/aaaa"))
		{
			alert("Merci de saisir une date valide !!");
		}
		else if ((document.getElementById("datemanif").value.charAt(2)!="/")&&(document.getElementById("datemanif").value.charAt(5)!="/"))
		{
			alert("Merci de saisir une date valide !!");
		}
		else if (document.getElementById("lieu").value=="")
		{
			alert("Merci de saisir un lieu de manifestation !");
		}
		else
		{
			document.getElementById("partie1").innerHTML = 
			'<p align="right">' + document.getElementById("name22").value 
			+ "<p align='right'>" + document.getElementById("phone22").value
			+ "<p align='right'>" + document.getElementById("mail223").value
			+ "<p align='right'>&nbsp;"
			+ "<p align='right'>Tel:&nbsp;" + document.getElementById("mail22").value;
			if ( document.getElementById("mail24").value != "" )
			{
				document.getElementById("partie2").innerHTML = 
				"<p align='right'>Fax:&nbsp;" + document.getElementById("mail24").value;
			}
 
 
			document.getElementById("partie3").innerHTML = 
			"<p align='right'>" + customDateSpring()
			+ "<p align='center'>&nbsp;</p>"
			+ "<p align='center' class='Style1'>DEVIS</p>"
			+ "<p align='center' class='Style1'>" + document.getElementById("titreanim").value
			+ "<p align='center' class='Style1'>&agrave; &nbsp;" + document.getElementById("lieu").value
			+ "<p align='center' class='Style1'>&nbsp;</p>"
			+ "<p class='Style2'>Animation</p>"
			+ "<p align='right' class='Style2'>Prix Hors Taxes</p>";
 
			for (j=1;j<13;j++)
			{
 				if ( document.getElementById("choix" + j ).checked == true )
				{
					chaine += "<p>" + tabchoixtitre[j-1] + "<p align='right'>" + tabchoixprixht[j] ;
					totalprixHT += tabchoixprixht[j] ;
				}
			}
			totalprixTTC=(Math.round((totalprixHT*1.196)*1000))/1000;
			totalprixTTC=totalprixTTC.toFixed(3);
			totalprixHT=totalprixHT.toFixed(3);
 
			document.getElementById("partie4").innerHTML = chaine ;
			document.getElementById("partie5").innerHTML =
			  "<p align='right' class='Style2'>Prix Total HT =  " + totalprixHT
			+ "<p align='right' class='Style2'>Prix Total TTC =  " + totalprixTTC
			+ "<p>&nbsp;</p>"
			+ "<p align='center'><strong>Ces tarifs ne peuvent tenir lieu d&prime;engagement que sous reserve de disponibilit&eacute;</strong></p>"
			+ "<p align='center'>( Restant &agrave; votre disposition pour tout renseignement par Email à contact@topanimation.com ou par téléphone au 03 86 21 53 39 )</p>"
			+ "<p align='center'>&nbsp;</p>"
			+ "<p align='center'>Ce document n&prime;a aucune valeur et n&prime;engage qu&prime;un contact avec notre soci&egrave;t&eacute;. </p>"
			+ "<p align='right'>&nbsp;</p>"
			+ "<p align='right'>&nbsp; </p>"
			+ "<p align='left' class='Style2'>&nbsp;</p>"; 
			alert(" Une fénètre va s'ouvrir si toute fois votre système bloque celle-ci il faut autoriser son ouverture si vous voulez imprimer !!");
			popup();
			document.getElementById("text" + noetape ).className='invisibletext';
			noetape+=1;
			document.getElementById("text" + noetape ).className='visibletext';
			document.getElementById("imgetape").src="/images/etape/etape" + noetape + ".bmp";
 
 
		}
	}
	else if ( noetape == 4 )

noetape correspond a savoir sur kel Div je suis !!
kan c'est a 3 j'inserre mon HTML dan le div 4 pour avoir l'affichage aprèsd'une présentation du DEVIS et ensuite un bouton s'ajoute en bas pour l'aperçu par la popup !
et tout sa est dans une page PHP voila le lien pour comprendre
www.topanimation.com/index.php?p=devis

03/02/2006, 13h07
SpaceFrog

la seconde focntionne sous IE et firefox ... testé et approuvé ...

copie texto le code que je t'ai filé ... il focntionne !
03/02/2006, 13h17
snoups58

je veux pas te manker de respect mais sa marche pas !!

regarde au desuus g editer mon post

le pire c ke je veux en plsu intergrer un bouton dans la popup pour envoyer une impression et de ce fait fermer la popup
03/02/2006, 13h20
SpaceFrog

as tu essayé de faire un simple copier coller des deux code que je t'ai filé ...
j'ai testé et retesté sous IE et Firefox et ça tourne ...

Maintenant je n'ai pas le temps de décortiquer ton usine à gaz ...
alors part des codes que je t'ai donnés et QUI FONCTIONNENT !

tu dois avoir une page principale et un modèle (modele.htm) dans le même repertoire.
03/02/2006, 13h33
snoups58

c bon sa marche nikel ;) juste un truc ke j'avais oublier d'enlever !!:?

merci bocoup un derniere chose pour fermer la popup je fais juste
window.close(); dans la page popup c sa ?
03/02/2006, 13h35
SpaceFrog

heu non pour fermer la popup il faut le faire depuis la page mère ...
je fais un test ...

dans la page principale:
Code:

1 2 3 4 5 6 7 8 9 <script type='text/javascript'> var dow function popup(){ dow = window.open("modele.htm","modele", "resizable=no, toolbar=no, scrollbars=no, location=no, width=200, height=200, top=100, left=100"); } function closepopup(){ dow.close() } </script>
dans le modèle

Code:

<input type="button" onclick='window.opener.closepopup()' value="fermer" />

Voir 40 message(s) de cette discussion en une page