Comment exploiter une variable contenant de l'HTML ?

**beber005** · 20/06/2011, 09h51

Bonjour

Je vous explique mon problème : j'aimerais stocker dans une variable javascript un contenu HTML comme suit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
var bodyCorps = '<HTML><HEAD><TITLE>NewsLetter</TITLE><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />'+
	'<style type="text/css">'+
	'*{padding: 0px;margin:0px;}hr{	visibility:	hidden;}.image{	background:		transparent url(\'cid:ENTETE.gif\') no-repeat top center;height:200px;padding-right:8px;padding-top:	90px;}'+
	'.bordureDuHaut{background:	transparent url(\'cid:BORDURE_haut.gif\') no-repeat top;height:6px;}.fond{background:	transparent url(\'cid:FOND_1px.gif\') top;height:569px;font-family:calibri,cambria,arial,candara;color :#000099;}'+
	'p{text-align:	center;}#texte{padding-left:20px;font-size:130%;}#texteScrollable{position:	relative ;width:800 ;height:569;overflow :auto ;font-size: 	10pt;}'+
	'.bordureDuBas{background:	transparent url(\'cid:BORDURE_bas.gif\') no-repeat top;height:6px;}.finDuFond{background:	transparent url(\'cid:FOND_1px.gif\') top;height:6px;}'+
	'#bouton_send{text-align: center;width:100%;}.logoAirbus{float:right;width:100px;background:white url(\'cid:LOGO_AIRBUS.gif\') no-repeat;height: 	24px;}'+
	'</style></HEAD><BODY><div class="image"><div align="bottom" class="logoAirbus" ></div></div><div class="fond" id="texteScrollable"><div class="bordureDuHaut">'+
	'</div>	<div id="texte"><p><b>Dear all,</b></p>'
	'</div></div><form method=post action="test.php"><div class="finDuFond"><div class="bordureDuBas"></div></div></form></BODY></HTML>'

Je voulais savoir s'il était possible d'exploiter ce contenu pour que sa donne forme à de l'HTML. Sachant que je transmet ce paramètre par une requête AJAX. Je sais pas si je me suis bien fais comprendre mais n'hésitez pas si jamais vous ne comprenez pas où vouliez plus de précision. Meric de votre écoute

**SpaceFrog** · 20/06/2011, 09h58

ben mets le juste en innerHTML dans un div ou document Fragment

**beber005** · 20/06/2011, 10h23

En fait je l'exploite de la façon suivante ma variable. Mais pour quelle soit exploitable comme tu me l'indique je dois utiliser un innerHTML où ça ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('Body').value = bodyCorps;

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<form method=post name="formpopup"action="email.php">
<!--Ce div correspond la répétition du fond de la  Newsletter--> 
<div class="finDuFond">
	<!--Ce div  affiche la bordure de séparation en bas-->
	<div class="bordureDuBas">
	</div>
	<!--Ce div correspond au bouton envoyer-->
	<div id="bouton_send">
		<input type="submit" value="Send Newsletter"/>
		<!--Permet de récupérer et de transmettre par POST les email à la page PHP-->
		<input type="hidden" name="Email" id="Email"/>
		<input type="hidden" name="Body" id="Body"/>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$mail->$_POST['Body'];

**SpaceFrog** · 20/06/2011, 11h07

heu "exploitable" ... où ça ?
coté client ou serveur ??? en js ou php ?

**beber005** · 20/06/2011, 11h08

Je dirais PHP. J'envoi un mail et je veux que le corps de ce mail contienne ma structure HTML contenu dans ma variable. Est ce possible tu penses ? Actuellement j'envoi parfaitement un mail avec tout ce qu'il faut sauf le contenu --' ce qui est l'essentiel ^^

**SpaceFrog** · 20/06/2011, 12h17

ben si tu passes par un form, mets le contenu dans un input type hidden en en faisant un encodeURIComponent ...

**beber005** · 20/06/2011, 13h13

excuses moi de te demander ça mais pourrais tu me donner la structure car je connais pas du tout encodeURIComponent et je ne sais pas comment ça marche

**andry.aime** · 20/06/2011, 13h26

Bonjour,

Envoyé par beber005

excuses moi de te demander ça mais pourrais tu me donner la structure car je connais pas du tout encodeURIComponent et je ne sais pas comment ça marche

encodeURIComponent .

A+.

**beber005** · 20/06/2011, 15h12

Merci je sais chercher ^^ je sais que ça peut énerver ces questions. Je sais juste pas où dans mon code le positionner

**andry.aime** · 20/06/2011, 15h29

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('Body').value = encodeURIComponent(bodyCorps);

**beber005** · 20/06/2011, 15h43

Merci beaucoup de votre aide mais ça ne change rien à mon probèle les destinataires reçoivent toujour un mail avec un contenu vide et je ne sais vraiment pourquoi.

**SpaceFrog** · 20/06/2011, 16h13

ton souci se trouve plutot coté php non ??

le fait de mettre ta variable dans un input permet de l'envoyer au serveur
après l'envoi du mail se fait coté serveur ...

**beber005** · 20/06/2011, 16h35

Tu dois avoir raison j'ai pensé pareil. J'ai mis un alert pour voir si il prenait bien ma variable body et il me l'affiche donc ça doit venir du traitement que je fais en PHP.
Je fais ça pour exploiter le contenu tu peux me dire si syntaxiquement c'est correct ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$mail->$_POST['Body'];

**fab256** · 20/06/2011, 17h05

T'aura a faire des modifications sur ton script PHP, je ne vois pas l'utilité d'envoyer un texte qui ne change pas vers un script PHP???
Je vois que dans tode HTML a envoyer dans l'email il y'a des images, tu as deux possibilité ou écrire l'adresse directe de l'image hebergé sur ton site genre http://www.example.com/img/2u_cs_mini.jpg

ou bien l'integrer avec ton email comme ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$mail->AddEmbeddedImage('img/ENTETE.gif','ENTETE.gif');

J'ai utilisé la classe phpmailer. Y'a un un bon tutorial sur ce meme site.

J'ai supposé que tes images se trouve dans le repertoire "img"

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
<?
	require "phpmailer2/class.phpmailer.php";
 
	$mail = new PHPmailer();
	$mail->IsHTML(true);
	$mail->From='tonemail@courrier.fr';
	$mail->AddAddress('varsemail@courrier.fr');
	$mail->AddReplyTo('tonemail@courrier.fr');	
	$mail->Subject='Envoi email';
 
	$mail->AddEmbeddedImage('img/ENTETE.gif','ENTETE.gif');
	$mail->AddEmbeddedImage('img/BORDURE_haut.gif','BORDURE_haut.gif');
	$mail->AddEmbeddedImage('img/BORDURE_bas.gif','BORDURE_bas.gif');
	$mail->AddEmbeddedImage('img/FOND_1px.gif','FOND_1px.gif');
	$mail->AddEmbeddedImage('img/LOGO_AIRBUS.gif','LOGO_AIRBUS.gif');
	$mail->CharSet="iso-8859-1";
// $mail->Body=$_POST['body_html']; si tu veux recuperer ton body_html a travers un formulaire
	$mail->Body='<HTML><HEAD><TITLE>NewsLetter</TITLE><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />'.
 
	'<style type="text/css">'.
 
	'*{padding: 0px;margin:0px;}hr{	visibility:	hidden;}.image{	background:		transparent url(\'cid:ENTETE.gif\') no-repeat top center;height:200px;padding-right:8px;padding-top:	90px;}'.
 
	'.bordureDuHaut{background:	transparent url(\'cid:BORDURE_haut.gif\') no-repeat top;height:6px;}.fond{background:	transparent url(\'cid:FOND_1px.gif\') top;height:569px;font-family:calibri,cambria,arial,candara;color :#000099;}'.
 
	'p{text-align:	center;}#texte{padding-left:20px;font-size:130%;}#texteScrollable{position:	relative ;width:800 ;height:569;overflow :auto ;font-size: 	10pt;}'.
 
	'.bordureDuBas{background:	transparent url(\'cid:BORDURE_bas.gif\') no-repeat top;height:6px;}.finDuFond{background:	transparent url(\'cid:FOND_1px.gif\') top;height:6px;}'.
 
	'#bouton_send{text-align: center;width:100%;}.logoAirbus{float:right;width:100px;background:white url(\'cid:LOGO_AIRBUS.gif\') no-repeat;height: 	24px;}'.
 
	'</style></HEAD><BODY><div class="image"><div align="bottom" class="logoAirbus" ></div></div><div class="fond" id="texteScrollable"><div class="bordureDuHaut">'.
 
	'</div>	<div id="texte"><p><b>Dear all,</b></p>'.
	'</div></div><form method=post action="test.php"><div class="finDuFond"><div class="bordureDuBas"></div></div></form></BODY></HTML>';
 
	if(!$mail->Send()){
	  echo $mail->ErrorInfo; 
	}
	else{	  
	  echo 'Mail envoyé avec succès';
	}
	unset($mail);
?>

PS : sur ton code Javascript il manque un '+' a la ligne 9

**SpaceFrog** · 20/06/2011, 17h07

faut peut etre faire un decodeURIComponent coté php ...

**fab256** · 20/06/2011, 17h31

Peut-tu nous expliquer que fait ton code HTML que tu envoi a travers body exactement???

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
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
92
93
94
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>NewsLetter</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
* {
	padding: 0px;
	margin:0px;
}
 
hr {
	 visibility: hidden;
}
 
 .image {
	 background: transparent url ('cid:ENTETE.gif') no-repeat top center;
	height:200px;
	padding-right:8px;
	padding-top: 90px;
}
.bordureDuHaut {
	background: transparent url('cid:BORDURE_haut.gif') no-repeat top;
	height:6px;
}
 
 .fond {
	background: transparent url('cid:FOND_1px.gif') top;
	height:569px;
	font-family:calibri,cambria,arial,candara;
	color :#000099;
}
 
 p {
	text-align: center;
}
 
 #texte {
	padding-left:20px;
	font-size:130%;
}
 
 #texteScrollable {
	position: relative ;
	width:800;
	height:569;
	overflow :auto ;
	font-size: 10pt;
}
 
 .bordureDuBas {
	background: transparent url('cid:BORDURE_bas.gif') no-repeat top;
	height:6px;
}
 
 .finDuFond {
	background: transparent url('cid:FOND_1px.gif') top;
	height:6px;
}
 
 #bouton_send {
	text-align: center;
	width:100%;
}
 
 .logoAirbus {
	float:right;
	width:100px;
	background:white url('cid:LOGO_AIRBUS.gif') no-repeat;
	height: 24px;
}
</style>
 
</head>
 
<body>
  <div class="image">
    <div align="bottom" class="logoAirbus"></div>
  </div>
 
  <div class="fond" id="texteScrollable">
    <div class="bordureDuHaut"></div>
 
    <div id="texte">
      <p><b>Dear all,</b></p>
    </div>
  </div>
 
  <form method="post" action="test.php">
    <div class="finDuFond">
      <div class="bordureDuBas"></div>
    </div>
  </form>
</body>
</html>

**beber005** · 21/06/2011, 09h40

Alors en fait le code HTML que je transmet structure ma newsletter, couleurs contenu etc... Je veux transmettre tout ce contenu par mail en fait et c'est pour ça que je le passe au travers d'une variable. Mais je ne sais pas si cela est possible

**SpaceFrog** · 21/06/2011, 09h45

Biensur c'est possible
je en vois pas pourquoi tu ne pourrais passer une variable string à php !

**beber005** · 21/06/2011, 10h00

Le php me retranscrira exactement la même structure ?..Je comprends pas pourquoi le mail est vide je dois me tromper dans le chemin que j'indique à mes images. Mais même sans ça je devrais avoir un semblant de contenu par mes div etc non ??

**SpaceFrog** · 21/06/2011, 10h08

php n'est qu'une "machine à ecrire" de l'html ...

si tu lui passes une variable string ... il écrit la variable string

faut juste faire attention aux échappements nécessaires pour passer le string dans l'url et au "désechappement" nécessaire pour l'écrire avec php

Comment exploiter une variable contenant de l'HTML ?

JavaScript

Discussions similaires

Partager

Partager