Discussion :

[argon]

Bonjour

J'ai réalisé mon site avec ces tutos

Mon problème, est quand je valide un formulaire, le site se recharge sur la page d'accueil sans que le script JavaScript n'est pu être traité.

Là c'est un formulaire de contact.

Y a t'il un moyen de valider un formulaire sans que le site se recharge?

A bientôt

[SpaceFrog]

les tutos en eux même ne nous intéressent pas ...
il serait beaucoup plus intéressant de voir ton code !
Au vu des symptômes, je pense qu'il manque un .preventDefault();

[argon]

Bonjour

Voici le code

Voici le code du formulaire:

Code html :

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
<div id="success"></div>
 
		<form id="envoimess" action="contact.php" method="post">
 
			<label for="nom">Nom:</label>
            <span class="erreur"></span>
			<input type="text" name="nom" id="nom"/>
 
            <label for="email">Email:</label>
            <span class="erreur"></span>
			<input type="text" name="email" id="email"/>
 
            <label for="message">Votre message:</label>
            <span class="erreur"></span>
            <textarea name="message" id="message"></textarea>
 
            <input type="button" name="submit" id="submit" class="submit" value="envoyer">
 
      </form>
 
      <div id="load"></div>

Voici le script:

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
53
54
55
56
57
58
59
60
61
62
63
64
65
$(document).ready(function() {
 
		$('#success').hide();
		 $('#load').hide();
 
		$('#envoimess').submit(function(){
 
			valid =true;
 
			if($('#nom').val()==''){
        $('#nom').prev('.error').fadeIn(1000).text('Indiquez votre nom');
        valid = false;
      }
      else{
        $('#nom').prev('.error').slideUp();
      }
 
		 if(!$('#email').val().match(/^[a-z0-9._-]+@[a-z0-9.-]{2,}[.][a-z]{2,3}$/)){
        $('#email').prev('.error').fadeIn(1000).text('Email invalide');
        valid = false;
      }
 
      else{
        $('#email').prev('.error').slideUp()
      }
 
			if($('#message').val()==''){
        $('#message').prev('.error').fadeIn(1000).text('Indiquez votre message');
        valid = false;
      }
      else{
        $('#message').prev('.error').slideUp();
      }
 
			 if(valid==true)
      {
        var nom = $('#nom').val();
        var email = $('#email').val();
        var message = $('#message').val();
        var dataString = 'nom='+nom+'&email='+email+'&message='+message;
 
        $.ajax({
          type: 'POST',
          url: 'contact.php',
          data: dataString,
 
          beforeSend: function()
          {
            $('#load').fadeIn();
          },
 
          success: function()
          {
            $('#load').fadeOut();
            $('#form').slideUp();
            $('#success').slideDown();
            $('#success').text('Formulaire OK');
          }
        });
      }
 
			return false;
 
		});
});

A +

[darkterreur]

Bonjour,

essaye de rajouter à ton bouton ceci pour voir.

Code :

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

 onclick="return false;"

[argon]

Bonjour

Le .preventDefault(); bloc le fonctionnement du script et le onclick="return false;" ne fait rien.

Je pense que c'est la navigation qui pose problème

A +

[darkterreur]

Bonjour la seul idée que j'ai la tout de suite c'est d'essayer

1 avec une fonction tout simple tel que

Code :

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

1
2
3
function test(){
console.log('je passe');
}

2 essaye avec avec un truc comme cela pour voir

Code :

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

<div  onclick="test();return false;">valid</div>

La tout de suite c'est tout ce qui me viens.