Creer page html simple dyamique

**sorry60** · 04/07/2007, 15h25

Bonjour,

Je souhaite creer et faire apparaitre en popup une page.html simple, le tout en javascript.
J'ai 2 champs : nom et prenom et un bouton.
Je souhaite que lors du clic sur le bouton, une popup s'ouvre avec comme contenu les 2 champs en gras (par exemple).

J'ai essay� :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
 
function aff_popup() {
   var w = new Window();
   w.innerHTML = "<html><body>test</body></html>";
   w.open();
}

Mais c'est pas bon

Voil� j'espere que vous pourrez me donner quelques pistes.

Merci
Sorry

Edit : je n'ai pas de probleme pour recuperer le contenu des champs, c'est l'ouverture d'une popup qui me g�ne. Car ma page n'est pas en dur quelque part..

**SpaceFrog** · 04/07/2007, 15h31

un methode pas tr�s propre avec document.write ...!

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type='text/javascript'>
function popup(){
var mypopup=window.open('','Motif','toolbar=no,scrollbars=no,resizable=no,height=150,width=250,top=200,left=200');
mypopup.document.write("<html><head><title>Innovative Workload For Laboratory</title></head>");
mypopup.document.write("<body style=\"background:url('snow.gif')\"  >")
mypopup.document.write("<form><table border=1 align=center > ");
mypopup.document.write("<tr> ");
mypopup.document.write("<td >Login</td>");
mypopup.document.write("<td><input type='text' name='login' size='10' value='' /></td></tr> ");
mypopup.document.write("<tr>");
mypopup.document.write("<td>Mot de passe </td>");
mypopup.document.write("<td><input type='text' name='mdp' size='10' value=''/></td></tr> ");
mypopup.document.write("<tr><td align=center colspan=2><input type='button' onclick='window.opener.ajouterTableau(this.form,libelle.value);' value='Ajouter' /></td></tr>");
mypopup.document.write("<tr><td align=center colspan=2><input type='button' onclick='window.close();' value='Annuler' /></td></tr></table></form>"); 
mypopup.document.write("<script type='text/javascript'> document.getElementsByTagName('body')\[0\].style.backgroundColor='green'; &lt;\/script&gt;")
mypopup.document.write("&lt;body>&lt;/html>")
mypopup.document.close()
}
</script>

**sorry60** · 04/07/2007, 15h40

Hmm �a me donne une erreur :

popup is not a function

**SpaceFrog** · 04/07/2007, 15h47

mouarf ...
c'est que tu n'as pas su impl�menter le code ...

Sinon voici une methode hybrique qui � l'air de vouloir tourner sous IE et FFX ...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script type='text/javascript'>
function popup(){
var mypopup=window.open('','Motif','toolbar=no,scrollbars=no,resizable=no,height=150,width=250,top=200,left=200');
mypopup.document.write("<html><head><title></title></head><body></body></html>")
//var pagehtml=mypopup.document.createElement('html');
//var headhtml=mypopup.document.createElement('head');
//var bodyhtml=mypopup.document.createElement('body');
//pagehtml.appendChild(headhtml);
//pagehtml.appendChild(bodyhtml);
//mypopup.document.appendChild(pagehtml)
var monimage=mypopup.document.createElement('img')
var pic=new Image();
pic.src="snow.gif";
monimage.src=pic.src;
mypopup.document.body.appendChild(monimage)
mypopup.document.close()
}
</script>
</head>
 
<body onload="popup();"  >

� noter que les lignes comment�es ne passent pas sous FFX ...

**sorry60** · 04/07/2007, 16h16

Ca marche pas � tous les coups

Mon code :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
 
function popup() {
var mypopup=window.open('','Motif');
mypopup.document.write("<html><head><title></title></head><body>test</body></html>");
return false;
}

**SpaceFrog** · 04/07/2007, 16h18

met un setTimeout sur la seconde ligne ...
il faut le temps que le popup s'impl�mente ...

**sorry60** · 04/07/2007, 16h35

Envoy� par SpaceFrog

met un setTimeout sur la seconde ligne ...
il faut le temps que le popup s'impl�mente ...

D�sol� mais je d�bute en JS.. le setTimeout tu peux m'en dire un peu plus ?

**Auteur** · 04/07/2007, 16h35

L'id�al est de cr�er sur ton serveur une page avec un minimum de code (fonctions de gestion de l'ouverture ou de la fermeture de la pop-up, etc...) ,cf. cet exemple ou ces scripts.

Tu appelles ensuite cette page en tant que pop-up. Il te sera ainsi plus simple d'ajouter ou supprimer des �l�ments dans la pop-up et d'y transf�rer les informations n�cessaires.

**SpaceFrog** · 04/07/2007, 16h45

ce n'est pas avec toi que l'on discutait de �a l'autre jour Auteur ?
avec la securit� de about:blank et l'insertion d'une image ?

on dirait que la solution hybride permette de le faire ...

sinon + 1000 pour une page html vide appel�e dans le window.open

**sorry60** · 04/07/2007, 16h55

Envoy� par Auteur

L'id�al est de cr�er sur ton serveur une page avec un minimum de code (fonctions de gestion de l'ouverture ou de la fermeture de la pop-up, etc...) ,cf. cet exemple ou ces scripts.

Tu appelles ensuite cette page en tant que pop-up. Il te sera ainsi plus simple d'ajouter ou supprimer des �l�ments dans la pop-up et d'y transf�rer les informations n�cessaires.

Oui j'avais pens� � cette solution, je pense que je vais essayer, �a sera plus pratique.

Merci � vous pour votre aide.

**Auteur** · 04/07/2007, 19h33

Envoy� par SpaceFrog

ce n'est pas avec toi que l'on discutait de �a l'autre jour Auteur ?
avec la securit� de about:blank et l'insertion d'une image ?

on dirait que la solution hybride permette de le faire ...

si, si c'�tait avec moi

La solution hybride ?? Tu fais allusion � cette discussion

**SpaceFrog** · 04/07/2007, 19h49

oui je faisais bien allusion � ce thread ...

solution hybride = voir code ci dessus avec un bout de document.write qui � l'air de contourner le probl�me rencontr� avec le src de l'image sous FFX

**Auteur** · 04/07/2007, 20h13

personnellement, je n'aime pas trop le document.write()

Visiblement par cette ligne de code

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

mypopup.document.write("<html><head><title></title></head><body></body></html>")

tu cr�es une page blanche.

**SpaceFrog** · 04/07/2007, 20h31

je suis comme toi le document.write

mais dans ce cas de figure cela semble shunter la "s�curit�" qui bloque la modification de page about:blank ..

**sorry60** · 05/07/2007, 13h13

J'ai encore un probl�me, j'ai essay� �a :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
 
function previsu_art() {
	var page=window.open('autres/previsu.html','Prévisualisation de l\'article');
	setTimeout("",1000);
	var id_div = page.document.getElementById('id_div_center').id;
	alert(id_div);
}

Mais �a me donne une erreur :

page.document.getElementById('id_div_center') has no properties

Pourtant dans previsu.html, j'ai bien un element ayant "id_div_center" comme id :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
<div class="div_center" id="id_div_center">
</div>

**SpaceFrog** · 05/07/2007, 14h28

oui mais la fonction qui essaye de mettre la main sur le div faut la mettre DANS le setTimeout...

**Auteur** · 05/07/2007, 14h39

le setTimeout n'interrompt pas l'ex�cution du script.

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
var page;
function afficheIdDiv()
{
	var id_div = page.document.getElementById('id_div_center').id;
	alert(id_div);
}
 
function previsu_art() {
	page=window.open('autres/previsu.html','Prévisualisation de l\'article');
	setTimeout("afficheIdDiv()","1000");
 
}

par ailleurs rien ne te dit que la page va se charger en moins d'une seconde : tout depend de son contenu et de la connexion de l'utilisateur.

**SpaceFrog** · 05/07/2007, 14h42

la seconde possibilit� est de mattre un setInterval pour verifier l'existance du div (puis un clearInterval lorsque le div existe et lancer le reste de la fonction )

**sorry60** · 05/07/2007, 14h45

Ok j'avais mal compris le setTimeout(), je pensais qu'il faisait une pause, alors que non il appelle une fonction forc�ment au bout de xxx.

Merci � vous, je corrige

Edit : c'est nickel ! merci � vous

Creer page html simple dyamique

JavaScript

Discussions similaires

Partager

Partager