Exécution de $.post() et soumission de formulaire

Version imprimable

Bonjour à tous!

J'essaye de faire une fonction qui va checker la valeur d'une input et qui va la comparer à une valeur présente dans la BDD. Dans la console il n'y a aucune erreur mais quand la fonction est censé retourner "false", le formulaire est quand même envoyé. Voici le code en question. Merci d'avance :D

Code HTML :

Code:

1
2
3
4
<form action="traitement/traitement.php" name="form" method="POST" onsubmit = "return check_password();" >
    <label id="rep_check" ></label>
    <input id="input_password" name="input_password" type="text" maxlength="5" required="required" />
</form>

Code Javascript :

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
function check_password(){
    var verif = document.getElementById('input_password');
    var passwordRegex = new RegExp(/^[a-z0-9]{5}$/);
    if((passwordRegex.test(verif.value))){
        $("#rep_check").removeClass().addClass('fi-refresh').fadeIn("fast");
        $.post("traitement/check_password.php" ,{ input_password:$(verif).val() } ,function(data){
            if(data == 'false'){
                $("#rep_check").removeClass().addClass('fi-prohibited').fadeIn("slow");
               return false;
            }
            else if(data == 'no'){
                $("#rep_check").fadeTo(fast,1,function(){
                    $("#rep_check").removeClass().addClass('fi-x-circle').fadeIn("slow");
                });
                return false;
            }
            else if(data == 'yes'){
                $("#rep_check").fadeTo(fast,1,function(){
                    $("#rep_check").removeClass().addClass('fi-like').fadeIn("slow");
                });
                return true;
            }
        });
    }
    else{
        $("#rep_check").removeClass().addClass('fi-prohibited').fadeIn("slow");
        return false;
    }
}

Code PHP :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
require_once '../include/include_connect_BDD.php';
global $bdd;
$input_password = $_POST["input_password"];
if(preg_match('/^[a-z0-9]{5}$/', $input_password)){      
    /*******RETOURNE $password**************************/
    include_once "../include/include_check_new_day.php";
    if($input_password == $password){
        echo ('yes');
    }
    else echo ('no');
}
else echo ('false');
?>

17/01/2014, 15h19
Bovino

:recherch: :fleche: Un classique AJAX : utiliser les données au bon moment !

J'ai trouvé la solution en passant par l'objet XMLHttpRequest. Merci à toi Bovino.

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
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
66
67
68
69
70
71
72
73
74
75
76
77
78
 
function getXMLHttpRequest(){
 
	var xhr = null;
 
	if (window.XMLHttpRequest || window.ActiveXObject){
		if(window.ActiveXObject){
            try{
                xhr = new ActiveXObject("Msxml2.XMLHTTP");
            } 
            catch(e){
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
        } 
        else{
			xhr = new XMLHttpRequest(); 
		}
	}
    else{
		alert("Votre navigateur n'ai pas compatible, veuillez préférer un autre outil de navigation internet...");
		return null;
	}
 
	return xhr;
}
 
 
function check_password(){
 
	var password_value = encodeURIComponent(document.getElementById('input_password').value);
	var repeat = document.getElementById('3aoud');
    var bool = false;
 
    $("#rep_check").removeClass().addClass('fi-refresh').fadeIn("slow");
 
	if(repeat.value != password_value){
 
        function request(callback){
            var xhr = getXMLHttpRequest();
 
            xhr.onreadystatechange = function(){
                if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)){
                    callback(xhr.responseText);
                }
            };
 
            xhr.open("POST", "traitement/check_password.php", false);
            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xhr.send("input_password=" + password_value);
        }
 
        function readData(sData){
 
            if (sData == "false"){
                $("#rep_check").removeClass().addClass('fi-prohibited').fadeIn("slow");
 
                repeat.value = password_value;
            }
            else if(sData == "no"){
                $("#rep_check").removeClass().addClass('fi-x-circle').fadeIn("slow");
 
            }
            else if(sData == "yes"){
                $("#rep_check").removeClass().addClass('fi-unlock').fadeIn("slow");
                bool = true;
            }
        }
 
        request(readData);
    }
    else{
        $("#rep_check").removeClass().addClass('fi-prohibited').fadeIn("slow");
        repeat.value = password_value;
    }
 
 
    return bool;
}