email avec le contenu d'une div

En effet, le nom de cookie contenant le panier semble être : "sc_simpleCart_1".
Le contenu n'est pas "bizarre". Il s'agit bel et bien du contenu du cookie :)

Seulement, il faut passer par simpleCart.js afin de traiter cette chaine et l'afficher sous forme de HTML.

On dirait qu'il y a une fonction js prévue pour l'envoie par mail du caddie : emailCheckout(). Elle est vide, il faut donc l'implémenter. Il faut s'inspirer de la fonction paypalCheckout(). En gros, ça crée un élément formulaire "caché" avec tous le contenu du cookie. On peut imaginer que emailCheckout() fait la même chose. Coté réception de ce formulaire caché (envoyer.php), il faut récupérer tous les champs dudit formulaire et recréer le contenu du cookie .... Bref, je me demande si je suis clair :D

ça peut être difficile à mettre en place, peut-être faudrait - il voir du coté des créateurs de ce module de caddie javascript ? S'ils ont prévu emailCheckout() peut-être l'ont-ils implémenté

tu es clair sur les explications mais je ne sais pas faire :(

si une âme charitable pourrais me venir en aide sur ce que je doit faire sa serait super :)

je vous remercie d'avance

où as-tu trouvé ce script ?

le code provient de ce site

Merci

Ok, en fait en recherchant un peu on peut trouver sur des sujets traitant du même problème.

Voici une solution :

Dans le fichier simpleCart.js, recherche me.emailCheckout = function()
et mets-y ce code à l'intérieur :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

me.emailCheckout = function() { itemsString = ""; for( var current in me.items ){ var item = me.items[current]; itemsString += item.name + " " + item.quantity + " " + item.price + "\n"; }   var form = document.createElement("form"); form.style.display = "none"; form.method = "POST"; form.action = "envoyer.php"; form.acceptCharset = "utf-8"; form.appendChild(me.createHiddenElement("jcitems", itemsString)); form.appendChild(me.createHiddenElement("jctotal", me.total)); document.body.appendChild(form); form.submit(); document.body.removeChild(form); }

---

Au début du fichier, mettre la valeur "Email" à la place de "PayPal" :

Code:

---

me.checkoutTo = Email;

---

Cela va créer un formulaire caché avec pour chaque item une ligne de ce type : "Nom article Qté Prix" et une ligne de total.

envoyer.php qui se charge d'envoyer le mail :

Code:

---

1 2 3 4 5 6 7 8 9 10 11

<?php if ($_POST['jcitems']) { $to = 'you@example.com'; $subject = 'the subject'; $jcitems = $_POST['jcitems']; $headers = 'From: webmaster@example.com' . "\r\n" . 'Reply-To: webmaster@example.com' . "\r\n"; mail($to, $subject, $jcitems, $headers); } header("Location:confirmation_mail.html"); ?>

---

(A noter que l'espace est à proscrire dans "confirmation mail.html". Mieux vaut mettre un underscore à la place de l'espace.)

Enfin, pour envoyer par mail, ajouter ça dans la page :

Code:

---

<a href="javascript:;" class="simpleCart_checkout">envoyer le panier par email</a>

---

Ainsi à chaque clic sur ce lien, le contenu du caddie sera envoyé par email. Bien sûr, il va s'en dire que pour le moment c'est ultra statique. On peut imaginer un champ à coté de ce lien (qui peut être un bouton au passage) pour renseigner l'adresse email de son choix

salut merci pour cette réponse plutôt complète.

il y a toujours un problème, le module lance paypal et non l'envoie du mail.

ce lien montre ce que j'ai fait, j'ai bien fait toute les étapes que tu décrit mais marche pas :(
j'ai bien fait aussi cette ligne :

Code:

---

1 2	me.checkoutTo = Email;

---

Merci beaucoup pour ton aide et surtout le temps passer sur mon problème.

dans le lien que tu as envoyé, il y a toujours dans le fichier javascript : me.checkoutTo = PayPal;
De plus, dans le fichier "boeuf.php", si tu fais afficher la source, tu verras qu'il y a aussi ça : simpleCart.checkoutTo = PayPal;

salut, dans le fichier JavaScript je le voie modifier.

ensuite je viens de modifier la ligne : me.checkoutTo = PayPal; par me.checkoutTo = Email; bon je reçoi le mail, mais il n'est pas trop lisible encore :

Citation:

---

Assortiment<span class=\"item_value\" style=\"visibility:hidden\">boeuf</span> 1 11.5 Détail<span class=\"item_value\" style=\"visibility:hidden\">boeuf</span> 1 16.5

---

je te remercie encore

même soucis que la dernière fois :

Code:

---

$headers .= 'Content-type: text/html; charset=utf-8' . '\r\n';

---

ça devrait marcher :ccool:

toujour un texte bizarre :

Citation:

---

Détailboeuf 1 16.5 Plat cuisinéboeuf 1 11.5

---

la mise en forme des données via une feuille CSS pour le contenu du mail n'est pas envisageable ??


Merci beaucoup

"charset=iso-8859-1" => à la place de "charset=utf-8"

Si bien sûr. On peut tout adapter :)
Pour le moment, cette chaine est générée à l'aide de cette ligne (du fichier javascript) :

Code:

---

itemsString += item.name + " " + item.quantity + " " + item.price + "\n";

---

Il suffit de la modifier afin qu'elle génère un code HTML et non plus une suite de valeur.

pour le charset je les changé aussi dans SimpleCart.js est le texte est maintenant visible... :)

pour la chaine de caractère, peux tu un peux plus rentré dans le sujet.
si elle passe en "mode" HTML (génère du code en HTML) où peux ce "glisser" le CSS ? :)

Merci beaucoup

dernière étape enfin j'espère : rendre le mail présentable :)

Citation:

---

Assortimentboeuf Carton de 10 kg (€/kg) 1 11.5 Détailboeuf Entrecôte (€/kg) 1 17 Plat cuisinéboeuf Daube de boeuf (750 g) 1 9

---

j'aimerais :

Citation:

---

style : cat : Description : qté : Prix :

Assortiment boeuf Carton de 10 kg (€/kg) 1 11.5
Détail boeuf Entrecôte (€/kg) 1 17
Plat cuisiné boeuf Daube de boeuf (750 g) 1 9

---

en gros un genre de tableau... :)


merci beaucoup pour l'aide

même présentation qu'actuellement en gros ?
Il suffit de modifier "itemString" et de la formatter selon le style souhaité. Il y a déjà des exemples dans la page.

Par exemple, à la "va-vite", les styles sont à ajuster en fonction de tes attentes :

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

me.emailCheckout = function() { itemsString = '<div style="border: 1px solid #000;width:450px;padding:7px 2px;margin:2px;">'; itemsString += '<table>'; for( var current in me.items ){ var item = me.items[current]; itemsString += '<tr>'; itemsString += '<td style="background:#E4B1B1;width:400px">' + item.name + '</td>'; itemsString += '<td style="background:#F7E8E8;width:25px">' + item.price+ '</td>'; itemsString += '<td style="background:#E4B1B1;width:25px">' + item.quantity + '</td>'; itemsString += '</tr>'; } itemsString += '<table>'; itemsString += '</div>'; itemsString += '-----------------------------' + "\n"; itemsString += 'Total: ' + me.currency + me.total + "\n";     var form = document.createElement("form"); form.style.display = "none"; form.method = "POST"; form.action = "envoyer.php"; form.acceptCharset = "utf-8"; form.appendChild(me.createHiddenElement("jcitems", itemsString)); document.body.appendChild(form); form.submit(); document.body.removeChild(form); }

---

Citation:

---

Détailboeuf Entrecôte (€/kg) 17 1
-----------------------------
Détailboeuf Noix (€/kg) 16.5 1
-----------------------------
Plat cuisinéboeuf Daube de boeuf (1 kg) 11.5 1
-----------------------------
-----------------------------
Total: EUR45

---

voilà le mail reçu après quelque modif sur la base que tu a fait et que je te remercie beaucoup :)

1 seul problème : il "colle" deux valleur :
-value
-name

je ne comprend pas le problème surtout que je demande que "name" et non "value"

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

me.emailCheckout = function() { itemsString = '<div style="border: 1px solid #000; width:1260px; padding:7px 2px; margin:2px;">'; itemsString += '<table style="border: 1px solid #000; width:1300px; padding:7px 2px; margin:2px;">'; for( var current in me.items ){ var item = me.items[current]; itemsString += '<tr>'; itemsString += '<td style="background-color:#E4B1B1; width:600px">' + item.name + '</td>'; itemsString += '<td style="background-color:#E4B1B1; width:600px">' + item.description + '</td>'; itemsString += '<td style="background-color:#F7E8E8; width:30px">' + item.price + '</td>'; itemsString += '<td style="background-color:#E4B1B1; width:30px">' + item.quantity + '</td>'; itemsString += '</tr>'; itemsString += '<tr>'; itemsString += '-----------------------------' + "\n";   itemsString += '</tr>'; } itemsString += '</table>'; itemsString += '</div>'; itemsString += '<table>'; itemsString += '<tr>'; itemsString += '-----------------------------' + "\n"; itemsString += '</tr>'; itemsString += '<tr>'; itemsString += 'Total: ' + me.currency + me.total + "\n"; itemsString += '</tr>'; itemsString += '</table>';   var form = document.createElement("form"); form.style.display = "none"; form.method = "POST"; form.action = "envoyer.php"; form.acceptCharset = "iso-8859-1"; form.appendChild(me.createHiddenElement("jcitems", itemsString)); form.appendChild(me.createHiddenElement("jctotal", me.total)); document.body.appendChild(form); form.submit(); document.body.removeChild(form); }

---

Petite question encore, comment faire envoyer un petit formulaire avec le nom, l'adresse et un petit message en même temps que le panier ?? je les déjà fait seul mais avec le panier j'y arrive pas.. :(

j'ai fait la parti html (ici), il reste a faire le bouton (bouton unique pour l'envoie du panier et le contenu du formulaire) et peut etre a mpodifier le fichier envoyer.php ?

merci beaucoup

Citation:

---

je ne comprend pas le problème surtout que je demande que "name" et non "value"

---

A mon avis, pour ajouter un article au panier, l'algo lit le DOM pour récup les infos de chaque élément. Par exemple, pour constituer "item.name", il va aller lire class="item_name".

Or, dans class="item_name", il n'y a pas d'espace. Comme on peut le voir par exemple ici : (pour lui, "boeuf" n'est pas caché. Voilà pourquoi il l'ajoute au "name").

Code:

---

<td width="50px" class="item_name">Assortiment<span class="item_value" style="visibility:hidden">boeuf</span></td>

---

Voila pourquoi, "Assortiment" est collé à "boeuf". Même explication pour les autres. Configure bien ce qu'il y a dans ce <td class="item_name"> et ça va rouler tout seul ;)

ps : ne cherche pas à afficher item.value. A mon avis, ça n'existe pas.

Citation:

---

Petite question encore, comment faire envoyer un petit formulaire avec le nom, l'adresse et un petit message en même temps que le panier ?? je les déjà fait seul mais avec le panier j'y arrive pas..

---

Le nom et l'adresse du destinataire ? Je n'ai pas pris le temps de regarder ta page, mais cela devrait néanmois t'inspirer :

Coté interface, il faut que tu ajoutes trois champs à ta page, par exemple au dessus de ton bouton pour envoyer le mail (un champ email / nom du destinataire, un message à son attention) :

Code:

---

1 2 3 4 5 6

<div id="menu_mail"> Email : <input type="input" name="jcmail_temp" id="jcmail_temp" value = "mail du destinataire" /> <br> Nom : <input type="input" name="jcname_temp" id="jcname_temp" value = "nom du destinataire" /> <br> Message : <textarea name="jcmessage_temp" id="jcmessage_temp" cols="20" rows="4"></textarea><br><br> <a href="confirmation mail.html">envoyer le panier par email</a> </div>

---

Coté JS, dans la fonction emailCheckout, on récupère les données et on les fournies au formulaire temporaire qui envoie le caddie :

Code:

---

1 2 3 4

// A ajouter sous les autres appendChild form.appendChild(me.createHiddenElement("jcname", document.getElementById('jcname_temp').value)); form.appendChild(me.createHiddenElement("jcmessage", document.getElementById('jcmessage_temp').value)); form.appendChild(me.createHiddenElement("jcmail", document.getElementById('jcmail_temp').value));

---

Coté PHP, on va récupérer ces nouveaux champs et les afficher à la suite du caddie (par exemple, à adapter bien sûr) :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

<?php if ($_POST['jcitems'] && $_POST['jcmail']) { $to = $_POST['jcmail']; $subject = 'Panier du site machin envoyé à '.$_POST['jcname']; $headers = 'From: webmaster@example.com' . "\r\n" . 'Reply-To: webmaster@example.com' . "\r\n" . 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; // Le panier $jcitems = $_POST['jcitems']; // récupération du nom, message, email $message = ""; $message .= "Le panier a été envoyé à : ".$_POST['jcname']. ". Voici le message : <br>".$_POST['jcmessage']; // Le contenu : panier + formulaire $contenu = $jcitems."<br><br>".$message;     mail($to, $subject, $contenu, $headers); } header("Location:confirmation_mail.html"); ?>

---

A noter que désormais avec cette modif, ça envoie le mail à la personne que l'on a mentionné dans le champ prévu à cet effet.

BRAVO !!

Je te remercie beaucoup pour l'aide que tu me donne.

dernier petit truc (oui encore:mouarf:), comment supprimer le panier une fois le mail parti ?

Merci beaucoup encore une fois mais sa ne fait pas de mal :ccool:

:merci::merci::merci::merci::merci::merci::merci::merci::merci::merci::merci:

de rien ;) si t'as besoin de + d'explication sur le pourquoi du comment n'hésite pas !

Essaie de mettre les deux classes (celle qui permet de faire l'envoi du mail et celle qui permet de vider le panier) sur le même lien, séparées par un espace. Ainsi, le lien est affublé des deux classes.

Code:

---

<a href="javascript:;" class="simpleCart_checkout simpleCart_empty">envoyer le mail</a>

---

Je reste impréssionner sur la qualité de JavaScript qui permet e tout faire..

faut juste savoir comment faire, et pour ça il y a des personnes comme toi qui sont très bon !! :ccool::ccool:

Je te remercie encore une fois pour la rapidité de réponse (en plus elle sont bonne)

petite infos :
dans la parti du code plus bas, le width reste bien la largeur des cases du tableau ?? comme tu peux le voir j'ai bien agrandit les cases mais aucun changement dans le mail reçu :(

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

itemsString = '<div style="border: 1px solid #000; width:1800px; padding:7px 2px; margin:2px;">'; itemsString += '<table style="border: 1px solid #000; width:1660px; padding:7px 2px; margin:2px;">'; for( var current in me.items ){ var item = me.items[current]; itemsString += '<tr>'; itemsString += '<td style="background-color:#E4B1B1; width:400px">' + item.value + '</td>'; itemsString += '<td style="background-color:#E4B1B1; width:600px">' + item.name + '</td>'; itemsString += '<td style="background-color:#E4B1B1; width:600px">' + item.description + '</td>'; itemsString += '<td style="background-color:#F7E8E8; width:30px">' + item.price + '</td>'; itemsString += '<td style="background-color:#E4B1B1; width:30px">' + item.quantity + '</td>'; itemsString += '</tr>'; itemsString += '<tr>'; itemsString += '-----------------------------' + "\n";   itemsString += '</tr>';

---

De rien ;)
Woooow, 1800 px de large :D Un width de 360 px suffit pour tout contenir je pense non ?

Le nom : 100 px
La description : 200 px
prix + qté : 30 px chacun
=> 360 px

Peut-être que le border: 1px solid #000;ne lui plait pas. A mon avis il faut plutôt écrire ça ainsi :

Code:

---

style="border-width:5px;border-style:solid;border-color:#000; width:360px;padding-top:7px;padding-bottom:2px; margin:2px;"

---

les valeurs c’était juste pour être sur que rien ne bouge :)

je vien de tout enlever les styles pour ne laisser que la valeur de "width" mais sa ne marche pas .... :(

tu aurais une autre solution ??