Discussion :

[sebastien1985]

Bonjour, je suis débutant en programmation et je dois rendre un projet web. Pour ce projet on nous demande d'utiliser une fonction de type AJAX. Je voudrai faire une fonction qui vérifie dans une base de donnée (mysql) une adresse mail associé à un nom. Le problème c'est que sur le net je trouve plein de truc associant AJAX et PHP mais pas grand chose pour m'aider avec des Servlets et du JEE. Je vous donne mes code

Voilà le formulaire jsp

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
<form action='#' name="authentification" id="authentification" onsubmit="return (ValiderMail(this) && ValiderChampsFormulaire(this))">
 
<span id="erreur"></span>
 
<table width="380">
 
	<tr>
		<th align="left">
		<h2>Nom de l'expéditeur  :</h2>
		<input type='text' name='NomExpediteur' size='60'/><br>
	</th>
	</tr>
 
	<tr>
	<th align="left">
		<h2>Adresse courriel de l'expéditeur :</h2>
		<input type='text' name='EmailExpediteur' size='60' /><br>
	</th>
	</tr>
 
	<tr>
	<th width="25%" align="right">
		<input type='submit' name='bouton' value='OK' style="width:80px" onClick="ValiderMail(this.form) ; ValiderChampsFormulaire(this.form)"/><br>
	</th>
	</tr>
 
	<tr>
	<th align="right">
		<a href="#null" onclick="return ouverturePopUp('Interface1.jsp')">Pour une première utilisation cliquez ici</a>
	</th>
	</tr>
 
</table>	
</form>

Voici le code AJAX que j'ai pour le moment:

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
<SCRIPT type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></SCRIPT>
 
<script type="text/javascript">
 
$(document).ready( function () { 
        $("#authentification").submit(function() {      // à la soumission du formulaire                                                
                $.ajax({ // fonction permettant de faire de l'ajax
                   type: "POST",
                   url: "ServletVerificationAuthentification",
                   data: "nom="+$("#NomExpediteur").val()+"email="+$("#EmailExpediteur").val(), // données à transmettre
                   success: function(msg){ // si l'appel a bien fonctionné
                                if(msg==1) // si la connexion en php a fonctionnée
                                {
                                        $("div#connexion").jsp("<span id=\"confirmMsg\">Vous etes maintenant connectée;.</span>");
                                        // on désactive l'affichage du formulaire et on affiche un message de bienvenue à la place
                                }
                                else // si la connexion en php n'a pas fonctionnée
                                {
                                        $("span#erreur").jsp("Erreur lors de la connexion, veuillez vérifier vos données.");
                                        // on affiche un message d'erreur dans le span prévu à cet effet
                                }
                   }
                });
                return false; // permet de rester sur la même page à la soumission du formulaire
        });
});
 
</script>

Et voici le code de ma servlet:

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
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
 
		 Connection connexion = null;
		try {
 
		    // chargement du driver
		    Class.forName( "com.mysql.jdbc.Driver" );
		    String url = "jdbc:mysql://mysql.istic.univ-rennes1.fr:3306/base_25002205";
 
		    String utilisateur = "user_25002205";
 
		    String motDePasse = "1234";
 
		    // connexion à la BDD
		    connexion = DriverManager.getConnection(url, utilisateur, motDePasse);
 
		    //récupération des champs nom et email de la jsp
		    String nom=request.getParameter("NomExpediteur");
		    String email=request.getParameter("EmailExpediteur");
 
		    // requête
 
		    Statement statement = connexion.createStatement();
		    String requete="SELECT count(*) as res FROM LISTENOMMAIL WHERE nom='"+nom+"' AND mail='"+email+"' ;";
 
		    ResultSet resultat = statement.executeQuery(requete);
 
		    int res=0;
		    while(resultat.next()){
		    res= resultat.getInt("res");
		    }
 
			if (res==0) 
			{
				System.out.println("1");
			} else 
			{
				System.out.println("0");
			}
 
			connexion.close();
 
		} catch ( ClassNotFoundException e ) {
			System.out.println("probleme classe");
		    /* Gérer les éventuelles erreurs ici. */
		}
		 catch ( SQLException e ) {
		    /* Gérer les éventuelles erreurs ici */
			System.out.println("probleme sql");
		}

Si quelqu'un peut m'aider

[yildiz-online]

Ajax ce n'est pas compliqué, c'est simplement envoyer une requete http et appliquer un callback à son retour (donc le code ciient), à part ça coté serveur ce n'est pas vraiment différent (bien que tu puisse avoir des servlet async, mais inutile de compliquer si tu débutes)

Le plus simple est de commencer par un get, et coté serveur tu exposes une méthode qui te retourne une string "ok" par exemple, et tu met un alert dans le callback coté JS

Si tu arrives à faire ça, tu auras compris les principes, et le post ne devrait plus poser de problèmes.

[andry.aime]

Bonjour,

1- Tes éléments de formulaire n'ont pas d'attribut id, or que dans ton js, tu utilises un sélecteur par rapport à l'id ($("#...").
2-

Code javascript :

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

1
2
3
type: "POST",
		   url: "ServletVerificationAuthentification",
		   data: "nom="+$("#NomExpediteur").val()+"email="+$("#EmailExpediteur").val()

Code javascript :

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

1
2
3
method: "POST",
		   url: "ServletVerificationAuthentification",
		   data: {nom: $("#NomExpediteur").val(), email : $("#EmailExpediteur").val()}

A+.