[AJAX] Aide pour amélioration de code dans le cas où javascript pas accepter
Bonsoir.
J'ai un formulaire pour s'inscrire pour recevoir ma newsletter. Jusque la pas de problème. C'est que du PHP et de l'HTML. Par contre, je nous souhaite pas rechercher la page que le formulaire une fois que l'utilisateur clique sur valider.
En surfant sur internet, j'ai remarqué qu'il y avait une possibilité de valider un formulaire (et par la même occasion de faire lancé un script) sans recharger la page. J'avais deja fait sa avec une méthode lourde en ajax et pas fonctionnelle à 100%. En faisant des recherches sur notre amis "google", j'ai lu qu'il y avait une possibilité avec la librairy jquery qui est très utilisé (surtout par moi ;) ) et que l'on pouvait faire ce que je souhaite avec $.post(url,params,callback). (source: http://jquery.developpeur-web2.com/documentation/ajax/$.post.php ).
Voici mon code html correspondant au formulaire:
Code:
1
2
3
4
5
6
7
| <div id="formnewsletter">
<form action="" method="post">
Tape ton adresse mail:
<input type="text" name="adresse" id="adresse"/>
<input type="submit" value="S'inscrire"/>
</form>
</div> |
et voici mon code qui permet de faire ce que je souhaite:
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
| //initialisation du code
$(document).ready(function()
{
//Lorsque on clique sur le bouton submit présent dans le div id="formnewsletter" faire ....
$("#formnewsletter").submit(function()
{
//recuperation de la valeur qui de l'id #adresse
var s = $("#adresse").val();
//verification de la syntaxe de l'adresse mail
//faire plutot avec système de regex
var place = s.indexOf("@",1); //decoupage en partie de l'adresse tapé par rapport à @
var point = s.indexOf(".",place+1); //decoupage en partie après @ et redecoupage par rapport au point
//si la première partie est plus grande que 1, puis que la seconde est supérieure à 2 et qu'après le point il y ait plus de deux caractère alors ...
if ((place > -1)&&(s.length >2)&&(point > 1))
{
//lancement de la requete ajax pour envoyer l'adresse dans le fichier newsletter.php qui enregistrera les nouveaux abonnés
$.ajax({
url: "newsletter.php",
type: "POST",
data: {adresse: s},
success: function (data)
{
//renvoie du message pour confirmer ou infirmer l'inscription
$("#formnewsletter").html=data;
//document.getElementById("formnewsletter").innerHTML=data;
}
});
return false;
}
else
{
$("#formnewsletter").html='<i>Entrez une adresse mail valable</i><form action="" method="post">Tape ton adresse mail:<input type="text" name="adresse" id="adresse"/><input type="submit" value="S\'inscrire"/>';
}
});
}); |
Cependant mon problème est que je souhaiterais que dans le cas où le javascript est désactivé, que le formulaire fonctionne avec pour action la page newsletter.php . Si je le met directement dans mon action du formulaire, il y a un problème en ce sens que je suis rediriger vers ma page newsletter.php que le javascript soit activé ou non.
En schéma, je veux que si le javascript est activé que ce soit la méthode en ajax prenne l'exécution de la page newsletter.php et dans le cas inverse, que le formulaire envoye les informations vers la page newsletter.php
Je ne sais pas si je suis clair, si vous avez des problèmes à comprendre, n'hésitez pas.
