Bonjour,
Comme indiqué par WebD tu crées l'input sur ta page mais tu n'as pas à envoyer de mails si je comprends bien, juste à l'intégrer dans ta db donc il est préférable de ne pas passer par un submit.
Ton formulaire
<input type="email" id="subemail" name="subemail" value="" autocomplete="off" />
<button type="button" id="subbt" name="subbt">valider</button>
<p id="info"></p>
Css en exemple
body { margin:2% 0px; padding:0; background-color:#fff; text-align:center; font-family:Arial,sans-serif; font-size:12px; color:#000000; }
button { border:none; background:none; font-size:12px; cursor:pointer; color:#666; }
button:hover { color:#000; }
input { width:150px; height:20px; outline:none; border:1px solid #c0c0c0; padding:0px 10px; background-color:#fff; -moz-border-radius:6px; -webkit-border-radius:6px; -o-border-radius:6px; -khtml-border-radius:6px; border-radius:6px; }
Ton js
var globalfc={
// fonction basique de l'objet xhr
getxhr:function(){
var xhr=null;
if(window.ActiveXObject||window.XMLHttpRequest){
if(window.ActiveXObject){
try{
xhr=new ActiveXObject('Msxml2.XMLHTTP');
}catch(e){
xhr=new ActiveXObject('Microsoft.XMLHTTP');
}
}else{
xhr=new XMLHttpRequest();
}
}else{
// ta "window.location" ou ton alert
return null;
}
return xhr;
},
// fontion qui va traiter l'envoi
getext:function(blok,pge,loader,fc,x){
var xhr=globalfc.getxhr();
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&(xhr.status==200||xhr.status==0)){
blok.innerHTML=xhr.responseText;
}else if(xhr.readyState<4){
blok.innerHTML=loader;
}
};
// en imaginant que ta page php se trouve dans un dossier xhr, en get suffit pour ça
xhr.open('GET','xhr/'+pge+'.php?'+fc+'='+x,true);
xhr.send(null);
}
};
window.onload=function(){
(function(){
// tu récupères les éléments
var inp=document.getElementById('subemail'),
bt=document.getElementById('subbt');
// inutile pour l'exemple mais bon
inp.onfocus=function(){this.style.borderColor='#0ab2d6';};
inp.onblur=function(){this.style.borderColor='#c0c0c0';};
bt.onclick=function(){
// la valeur de l'input
var v=inp.value;
if(v.length!=0){
// appel de la fonction en indiquant le conteneur du message, la page php, le loader, le nom du get, la valeur de l'input.
globalfc.getext(document.getElementById('info'),'manager','en cours de validation...','subemail',v);
}
};
})();
};
ta page
manager.php dans le dossier xhr(en exemple)
// appel de tes classes pour pouvoir appeler celle de l'envoi mail en imaginant qu'elles sont dans un dossier "lib"
function lC($c){
require '../lib/'.$c.'.class.php';
}
spl_autoload_register('lC');
try{
// appel de la db
$db=DB::OPENDB();
if(isset($_GET['subemail'])){
// envoi du value dans la class php
$manager=new MailManager($db);
$manager->addEMail($_GET['subemail']);
}
}catch(Exception $e){ die('Ton blah blah ou ta redirection'); }
Ta class
DB.class.php
class DB
{
public static function OPENDB(){
// rien de neuf ici
$db=new PDO('mysql:host=tonhost;dbname='tadb','tatable','tonpass');
$db->setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION);
return $db;
}
}
Ta class
MailManager.class.php
class MailManager
{
protected $db;
// constructeur basique
public function __contruct($db){
$this->db=$db;
}
// la fonction d'ajout
public function addMail($mail){
$mail=stripslashes($mail); // pour dire que mais ça suffit pas ...
if(!empty($mail)){
// messages basiques
$help=array('votre e-mail semble invalide','voter e-mail a bien été enregistré');
if(preg_match('#^[a-zA-Z0-9][a-zA-Z0-9-_.]+@[a-zA-Z0-9-]{2,}\.[a-z]{2,4}$#',$mail)){
// fonction de sauvegarde en db
echo $help[1];
self::saveMail($mail);
}else{
echo $help[0];
}
}else{
echo $help[0];
}
}
}
public function saveMail($mail){
$add=$this->db->prepare('INSERT INTO tadb (contact,ndate) VALUES (:contact,NOW)');
$t=$add->execute(array(':contact'=>$mail));
}
}
En gros, et pour expliquer le fonctionnement, après le code peut certainement être raccourci et ce n'est pas sécurisé.
Aussi j'ai pas testé le code mais je suppose que ça fonctionne.
Modifié par t00rist (24 Mar 2012 - 12:36)