Transmettre le contenu d'une balise canvas à un script php [Résolu]

[liryks_6]

Bonjour,

J'ai créé une application sur laquelle les utilisateurs peuvent modifier en temps réel le contenu d'une balise canvas.
Je récupère ensuite le contenu de la balise comme ceci

Code :

1
2
3
 
var canvas = document.getElementById("canvas");
var imgca    = canvas.toDataURL("image/png");

Je cherche maintenant un moyen de transmettre ma variable imgca à un script PHP pour que l'utilisateur puisse ensuite se l'envoyer par e-mail.

Quelqu'un a t-il une idée??

Merci d'avance

[SpaceFrog]

$.post ?

[liryks_6]

Je ne vois pas comment utilisé $.post dans ce cas là? Pourrais tu m'expliquer comment tu vois les choses?

[SpaceFrog]

j'imaginais simplement passer imgca dans le data

Code :

data : imgca

[liryks_6]

J'ai opté pour cette solution:

Je récupère le contenu de ma variable canvas, puis je la passe à un formulaire caché. (Le formulaire doit se trouver en dernière position dans le body... je ne sais pas pourquoi...)

Code :

1
2
3
4
5
 
var canvas = document.getElementById("canvas");
var imgca    = canvas.toDataURL("image/png");
document.getElementById("hiddenElement").value = imgca;
document.getElementById("myHiddenForm").submit();

Voici le formulaire

Code :

1
2
3
4
 
<form id="myHiddenForm" action="somescript.php" method="post" style="display:none;">
    <input type="hidden" id="hiddenElement" value="" />
</form>

Je peux donc ensuite passé ma variable imgca qui contient l'image dans mon canvas en POST.

Je ne vois pas trop comment tu voulais faire avec $.post! Il y a un truc qui bloque dans mon esprit :-)!

[SpaceFrog]

ben juste envoyer ta valeur récupérée dans le data d'un post en jquery
rien de compliqué

Code :

1
2
3
4
5
 
var canvas = document.getElementById("canvas");
var imgca    = canvas.toDataURL("image/png");
$.post("somescript.php",{ "HiddenElement": imca} ,function(resp){
                   alert('les données ont été envoyées, et la réposes est :'+resp)})