Un probleme avec une popup

Version imprimable

voila g un pb ! je voudrai ouvrir une popup en y insérant du html !!
voici mon code :
Code:

1 2 3 4 5 6 7 8 9 10 function popup() { // ouvre une fenetre sans barre d'etat, ni d'ascenceur w=open("",'popup','fullscreen=yes, scrollbars=auto,toolbar=no'); w.document.write("<TITLE>Aperçu Devis</TITLE>"); w.document.write("<BODY>"); w.document.write("<img src='images/logoanim.GIF'>"); w.document.write(document.getElementById("text4").value) w.document.write("</BODY>"); w.document.close(); }
voila et sa me met indefini !! ??

en fait le html que je veu placer dans ma popup se trouver dans le document principal !!

Comment faire pour qu'il me mettent le text en form dans la popup ???

deux raisons pour lesquelles cela ne focntionne pas:

1) la popup n'est pas encore instanciée lors du document.write ...
il faut faire une pose ...

2) il faut en théorie ouvrir le document pour écrire dedans ..; (bienque IE s'en affranchisse)

ça donnerait donc un truc du genre
Code:

1 2 3 4 5 6 7 8 <script type='text/javascript'> var dow = window.open('../AA1.htm', 'popup', 'resizable=no, toolbar=no, scrollbars=no, location=no, width=100, height=100, top=100, left=100'); setInterval("Javascipt:void(0);",10000); dow.document.open(); document.write('blabla') dow.document.close(); </script>
cecie étant n'ayant pas chargé de document dans la popup je ne suis même par sur que cela fonctionne ...
j'ouvrirais about:blank et feraias des modifs dans cette page ...

en fait voila mon code html associer!!
Code:

1 2 <input name='apercu' id='apercu' class='bouton' value='Aperçu du DEVIS pour impression' type='button' onClick='javascript:popup();'>
je vien de tester marche po :s

tu n'a pas du bien lire mes conseils ...

je n'ai aucun souci avec ce code là:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script type='text/javascript'>
function popup(){
var dow = window.open('about:blank', 'popup', 'resizable=no, toolbar=no, scrollbars=no, location=no, width=100, height=100, top=100, left=100'); 
setInterval("Javascipt:void(0);",1000);
dow.document.open();
dow.document.write('hello world')
dow.document.close();
}
</script> 
 
</head>
 
<body>
<input name='apercu' id='apercu' class='bouton' value='Aperçu du DEVIS pour impression' type='button' onClick='javascript:popup();'> 
</body>

02/02/2006, 12h36
snoups58

oui peut etre avec 'hello word' mais met un text dans une balise avec un ID "text" et met dans document write (doucment.getElementById("text").value ) sa marche po :s autrement mettre un text simple ma version marchais ossi !!

le document.getEleme .... est indefini d'après le deboggeur !!
c pas le fait d'ouvrir la popup le pb c de pouvoir recup une zone contenu dans une balise Div de la page principal pour mettre le contenu de celle ci dans la popup !!
02/02/2006, 13h32
SpaceFrog

:lol:
normal !!!
faut pas la mettre dans doculent.write !!!!!

Code:

1 2 3 4 5 6 7 8 9 10 function popup() { // ouvre une fenetre sans barre d'etat, ni d'ascenceur w=open("",'popup','fullscreen=yes, scrollbars=auto,toolbar=no'); w.document.write("<TITLE>Aperçu Devis</TITLE>"); w.document.write("<BODY>"); w.document.write("<img src='images/logoanim.GIF'>"); w.document.write("</BODY>"); w.document.write(window.opener.document.getElementById("text4").value) w.document.close(); }
heu comment tu peux avoir un objet avec un id text4 dans une fenetre vide que tu ouvres ???????????????????????????????????????

je pense que tu essaye datteindre un opbjet de la fenetre mère ???

02/02/2006, 13h40
snoups58

bin oui c ce ke j'essai de te dire depuis tout a l'h !!!!!!

mdr :D on c pas compris je pense !!

mon objet avec l'id text4 est dans la feuille mère et je veu passer le code compris dans la balise <div id="text4">...</div> dans la popup !!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script type='text/javascript'>
function popup(){
var dow = window.open('about:blank', 'popup', 'resizable=no, toolbar=no, scrollbars=no, location=no, width=100, height=100, top=100, left=100');
setInterval("Javascipt:void(0);",1000);
dow.document.open();
document.write(opener.document.getElementById('texte4').value)
dow.document.close();
}
</script>
 
</head>
 
<body>
<input name='apercu' id='apercu' class='bouton' value='Aperçu du DEVIS pour impression' type='button' onClick='javascript:popup();'>
</body>

arf dialogue de sourds :lol:

essaye ce code ...

02/02/2006, 14h35
snoups58

avec ce code voila ce ke me dit le deboggeur : opener as no properties !!

je desepers ! :'(
02/02/2006, 14h38
SpaceFrog

self.opener ou window.opener

Arf problème de référence ...
le code est bien dans la page mùère donc :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type='text/javascript'>
function popup(){
var dow = window.open('', 'popup', 'resizable=no, toolbar=no, scrollbars=no, location=no, width=100, height=100, top=100, left=100'); 
setInterval("Javascipt:void(0);",1000);
dow.document.open();
dow.document.write(document.getElementById('text4').value)
dow.document.close();
}
</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>

idem : document.getElementById('text4').value has no properties

pfff c pourtant basic je veux mettre sa :
Code:

1 2 3 4 5 6 7 8 9 10 <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> </div>
avec du code html ki vien dans les SPAN dynamiquement par un innerHTML !!

je veu mettre tout ce code dans ma popup !!!

02/02/2006, 15h20
SpaceFrog

:evil: :evil: :evil: :evil: :evil: :evil: :evil: :evil: :evil:

depuis quand un div as il une value ????????????????????

dans le code que je t'ai filé c'est un input !!!!

remplace value par innerHMLT
02/02/2006, 15h30
snoups58

bon bin dsl mais je savais pas sa !! :? merci sa marche nikel ;)

heu marche plus :?

en fait je veu pas mettre que mon objet Text4 :?

voila ce ke g fait alors mais marche plus :?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
var dow = window.open('DEVIS Aperçu avant impression', 'popup', 'resizable=no, toolbar=no'); 
	setInterval("Javascipt:void(0);",1000); 
	dow.document.open(); 
	dow.document.write("<TITLE>Aperçu Devis</TITLE><link href='iticom.css' type='text/css'><BODY>");
	dow.document.write(document.getElementById('text4').value) ;
	dow.document.write("<input class='bouton' value='Impression du DEVIS' type='button' onClick='imprimer()'>"
	+"<script language='JavaScript'>"
	+"function imprimer(){"
	+"alert('Vous allez imprimez le Devis. Cette opération fermera cette fenètre mais votre demande n'est tjr pas fini !!');"
	+"document.print();"
	+"window.close();}</script></BODY>") ;
	dow.document.close();

et voila ce k'il me sort kan j'affiche la source de code de ma popup

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<HTML>
<HEAD>
<title>Top Animation</title>
 
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK rel="stylesheet" href="iticom.css" type="text/css">
</HEAD>
<BODY bgcolor="#37439C" background="images/stripebackground.gif"> 
<TABLE width="767" height="550" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000" bgcolor="#FFFFFF"> 
  <TR> 
    <TD valign="top"> 
      <TABLE width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> 
        <TR> 
          <TD> 
            <TABLE width="100%" 
....
....

En gros il me sort ma page d'accueil !!!

02/02/2006, 17h04
SpaceFrog

pourquoi tu ne mets pas directement tout dans la page html que tu affiches dans la popup et tu ne modifies que le contenu d'un div dans cette page ce serait beaucoup plus simple non

donc prépare une page à imprimer avec un div

Code:

<div id="contenu"></div>

et le script etc dedans ...

puis dans le script d'appel du popup:

Code:

dow.document.getElementById('contenu').innerHTML=document.getElementById('text4').value

;
02/02/2006, 17h20
snoups58

le pb c ke les script dedans sont dynamique !!

je c pas si g bien compris mais je veu bien un exemple je suis pas tres douer en java
02/02/2006, 17h30
SpaceFrog

les scripts sont dynamiques ... ben justement mets les en dur dans la page ...
tu n'as que le innerHTML du div contenu à modifier non ?

le bouton est toujours le même et il doit toukours imprimer non ?
03/02/2006, 10h07
snoups58

par contre je ne sais pas comment faire une nouvelle page !!
je voulais faire sa au debut mais je ne savais pas comment faire !
car en fait j'ai une fonction java qui m'insert le code HTML géner et après sa s'affiche sur ma page principale !

Ensuite je voudrais une popup du style aperçu avant impression !!
Et en bas de cette aperçu un bouton imprimer !!µ

Tu peut me dire comment je doit proceder st p ;)
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" />