Champ de formulaire et bdd

Etienne69
Javascript

Bonjour à tous...

Je travaille en local sur une WebAppli perso (gestion de menus et liste de courses).
J'ai donc créé un formulaire pour entrer dans ma bdd des aliments et j'aimerai ne pas avoir à remplir ce formulaire en entier pour au final avoir un message m'informant que cet article est déjà présent dans la base...
La partie PHP fonctionne, mais celle en JavaScript qui contôle la saisie à la perte de focus du champ 'nom' semble ne pas fonctionner.
(Je précise que je n'y connais rien (ou pas grand chose en JavaScript) et que mon code s'inspire d'éléments pris sur différents forums ou tuto...)

Voici mon code :

Le formulaire : 

<head>  
    <script src="/js/jquery.js"></script>       
</head>

// ...

<form method="post" action="+aliment_enregistrement.php">
     <fieldset>
          <legend>Enregistrement</legend>
          <label for="nom">Désignation : </label>
          <input type="text" name="nom" id="nom" value="" required /><br />
          <div id="namebox"></div> <br /><br />
     </fieldset>
     <input type="submit" value="Envoyer" />
     <input type="reset" value="Effacer" />
</form>

// ...
<script type="text/javascript">
$(function(){
    // Cette fonction s'execute une fois tous les éléments de ta page chargés    
    $("#nom").change(function(){
        // cette fonction s'execute au changement de valeur de ton input   

        var saisie = $(this).val(); // récupération de la valeur saisie par l'utilisateur         

        $.post("verifaliment.php", { "valeurSaisie" :  saisie })
            .done(function(data){
                 // cette fonction est executée au succès de l'appel ajax
                 // => elle prend en param le contenu de la réponse
                 if (data == 1) {
                    document.getElementById("namebox").innerHTML = "Attention : cet aliment a déjà été créé" ;
                 }
                 else if (data == 2) {
                    document.getElementById("namebox").innerHTML = "" ;
                 }
            })
            .fail(function(){
                 // cette fonction est executée en cas d'echec de l'appel
                 alert('Vérification de saisie impossible actuellement !');
            });    
   });
});
</script>

Et ma partie traitement : (verifaliment.php)

<?php
if (isset($_POST['valeurSaisie'])){
    // Connexion à la base de données :
    require ('connexion.php');
    // Formatage de la saisie utilisateur : 
    $nom = strtoupper($_POST['valeurSaisie']);
    // Requête vérification dans bdd si aliment déjà présent : 
    $requete = $bdd->prepare('SELECT aliment_id FROM menu_aliments WHERE aliment_nom = :nom LIMIT 1');
    $requete->execute(array('nom' => $nom));
    $count = $requete->rowCount();

    if($count > 0){     // L'aliment existe déjà dans la base
        $data = 1;          
    }
    else {              // L'aliment n'existe pas
        $data = 2;          
    }

    // Fermeture connexion 
    $requete->closeCursor();
}
?>
  • La sortie du champ 'nom' déclanche bien dans la console Web un appel sur la page 'verifaliment.php' mais aucun message n'apparait indiquant si l'aliment est présent ou non dans la base.

Je pense que je ne sais pas comment retourner le résultat de la page 'verifaliment.php à la page formulaire...

Je vous remercie d'avance pour votre aide !

2 réponses

betaWeb
Réponse acceptée

C'est tout à fait normal étant donné que ton script ne retourne rien du tout !
Il faut lui renvoyer un résultat sous forme de texte ou de JSON.

<?php
if (isset($_POST['valeurSaisie'])){
    // Connexion à la base de données :
    require ('connexion.php');
    // Formatage de la saisie utilisateur : 
    $nom = strtoupper($_POST['valeurSaisie']);
    // Requête vérification dans bdd si aliment déjà présent : 
    $requete = $bdd->prepare('SELECT aliment_id FROM menu_aliments WHERE aliment_nom = :nom LIMIT 1');
    $requete->execute(array('nom' => $nom));
    $count = $requete->rowCount();

    if($count > 0){     // L'aliment existe déjà dans la base
        $data = 1;          
    }
    else {              // L'aliment n'existe pas
        $data = 2;          
    }

    // Fermeture connexion 
    $requete->closeCursor();

    echo $data; // Tu affiches le résulat obtenu afin de le communiquer à la partie JS qui va récupérer ta donnée
}
?>
Etienne69
Auteur

C'était juste ça ! Oh punaise....Je pensais que $data était une sorte de variable
globale !
Merci mille fois Cyprien G...

Par contre j'ai dû mettre un espace dans mon .innerHTML = "" ; car sinon le message d'erreur
ne s’effaçait pas en cas de correction !