Ajax - les messages d'erreur avec echo [Résolu]

Signaler
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
-
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
-
Salut à tous,

J'ai une petit problème en Ajax, j'ai un formulaire qui envoie a ma base de donnée DDB en Ajax

Mais le soucis c'est que je ne peux plus afficher les messages d'erreur avec echo "..."; puisque la page ne se rafraîchie plus.
quand un utilisateur insert une adresse e-mail doublon ,
j'aimerai donc savoir comment faire pour afficher les messages d'erreurs, on m'a dit de faire une requête Ajax mais je gère pas du tout ça, merci à vous.
<?php 

if($_POST) {
// database connection
$server = '127.0.0.1';
$username = 'root';
$password = '';
$dbname = 'base';

$conn = new mysqli($server, $username, $password, $dbname);

// check db connection error message NE MARCHE PAS :( je ne sais pas pourquoi?

if($conn->connect_error) {
die("Connection Failed : " . $conn->connect_error);
}
else {
// echo "Successfully Connected";
}

$valid = array('success' => false, 'messages' => array());

$name = $_POST['fullName'];
$lastname = $_POST['lastname'];
$email = $_POST['email'];

$type = explode('.', $_FILES['userImage']['name']);


$type = $type[count($type) - 1];
$url = '/uploads/files/' . uniqid(rand()) . '.' . $type;

if(in_array($type, array('gif', 'jpg', 'jpeg', 'png'))) {
if(is_uploaded_file($_FILES['userImage']['tmp_name'])) {
if(move_uploaded_file($_FILES['userImage']['tmp_name'], $url)) {

//******************************************************************
// Vérification doublon email avant validation du formulaire

$sql = "SELECT * FROM visitor WHERE email = '$email' ";
$result = $conn->query($sql);
$row = $result -> fetch_array(MYSQLI_ASSOC);

if (empty($row)){
// dans ce cas, la requete n'a rien retourné..



}else{
echo "L'email existe déjà !";
}
// dans ce cas, ALERTE AJAX .. NE MARCHE PAS :( je ne sais pas pourquoi?
// ******************************************************



// Insert into database
$sql = "INSERT INTO visitor (Name, email, Image) VALUES ('$name','$email','$url')";

if($conn->query($sql) === TRUE) {
$valid['success'] = true;
$valid['messages'] = "Successfully Uploaded";

// dans ce cas, ALERTE AJAX .. MARCHE :)
// ******************************************************
}
else {
$valid['success'] = false;
$valid['messages'] = "Erreur lors du telechargement";
}
// dans ce cas, ALERTE AJAX .. NE MARCHE PAS :( je ne sais pas pourquoi?
// ******************************************************
$conn->close();

}
else {
$valid['success'] = false;
$valid['messages'] = "Error while uploading";
}
}
}

echo json_encode($valid);

// upload the file
}




Configuration: Windows / Chrome 86.0.4240.183

8 réponses

Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965
Tu dois remplacer les ECHO ( et les DIE )
par l'utilisation des variables
$valid['success'] = false;
$valid['messages'] = "L'email existe déjà !";


Ton script Ajax dans le JS doit certainement être avec la paramètre dataype:"json"
Donc... il faut absolument que tu renvoies du JSON ...

Tu aurais du le voir..... si, dans ton appel Ajax dans ton JSON tu avais gérer le error ou le fail

PS: A l'avenir, merci de préciser le langage dans les balises de code.
Explications à lire ENTIEREMENT disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

.

Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

ça ne marche pas :(
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

1 - Montre ton code Javascript

2 - Montre le code PHP modifié

3 - Montre nous la console de ton navigateur ( A noter que pour débuguer de l'ajax, je te recommande fortement d'utiliser le navigateur firefox ... et surtout.. n'oublie pas d'activer le debugage XHR )


4 - N'oublie pas d'appliquer les consignes pour poster correctement ton code sur le forum ( en précisant le langage dans les balises de code )
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Code Java script

<script type="text/javascript">
   var btnCust = '<button type="button" class="btn btn-default" title="Add picture tags" ' + 
      'onclick="alert(\'Cliquez sur la Photo pour télécharger.\')">' +
      '<i class="glyphicon glyphicon-tag"></i>' +
      '</button>'; 
  $("#avatar-2").fileinput({
     overwriteInitial: true,
     maxFileSize: 1500,
     showClose: false,
     showCaption: false,
     showBrowse: false,
     browseOnZoneClick: true,
     removeLabel: '',
     removeIcon: '<i class="glyphicon glyphicon-remove"></i>',
     removeTitle: 'Cancel or reset changes',
     elErrorContainer: '#kv-avatar-errors-2',
     msgErrorClass: 'alert alert-block alert-danger',
     defaultPreviewContent: '<img src="uploads/default-avatar.jpg" alt="Your Avatar" style="width:160px"><h6 class="text-muted">Click to select</h6>',
     layoutTemplates: {main2: '{preview} ' +  btnCust + ' {remove} {browse}'},
     allowedFileExtensions: ["jpg", "png", "gif"]
  });

  $(document).ready(function(){
   $("#uploadImageForm").unbind('submit').bind('submit', function(){

    var form = $(this);
    var formData = new FormData($(this)[0]);

    $.ajax({
     url: form.attr('action'),
     type: form.attr('method'),
     data: formData,
     dataType: 'json',
     cache: false,
     contentType: false,
     processData: false,
     async: false,
     success:function(response) {
      if(response.success == true) {
       $("#messages").html('<div class="alert alert-success alert-dismissible" role="alert">'+
        '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>'+
        response.messages + 
      '</div>');

       $('input[type="text"]').val('');
       $(".fileinput-remove-button").click();
      }
      else {
       $("#messages").html('<div class="alert alert-warning alert-dismissible" role="alert">'+
        '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>'+
        response.messages + 
      '</div>');
      }
     }
    });

    return false;
   });
  });
 </script>



code html
    <div class="form-group">
      <label for="email">email</label>
      <input name="email" type="text" required="required" class="form-control" id="email" placeholder="email">
    </div>
            
    <div class="form-group">
      <label for="exampleInputPassword1">Photo</label>      
      <div id="kv-avatar-errors-2" class="center-block" style="width:800px;display:none"></div>

            <div class="kv-avatar center-block" style="width:200px">
          <input id="avatar-2" name="userImage" type="file" class="file-loading">
      </div>
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
  </form>

 </div>


code php
<?php 

if($_POST) {
 // database connection
 $server = '127.0.0.1';
 $username = 'root';
 $password = '';
 $dbname = 'base';

 $conn = new mysqli($server, $username, $password, $dbname);

 // check db connection error message NE MARCHE PAS :( je ne sais pas pourquoi?
    
 if($conn->connect_error) {
  die("Connection Failed : " . $conn->connect_error);
 } 
 else {
  // echo "Successfully Connected";
 }

 $valid = array('success' => false, 'messages' => array());

 $name = $_POST['fullName'];
 $lastname = $_POST['lastname'];
 $email = $_POST['email'];

 $type = explode('.', $_FILES['userImage']['name']);
    
    
 $type = $type[count($type) - 1];
 $url = '/uploads/files/' . uniqid(rand()) . '.' . $type;

 if(in_array($type, array('gif', 'jpg', 'jpeg', 'png'))) {
  if(is_uploaded_file($_FILES['userImage']['tmp_name'])) {
   if(move_uploaded_file($_FILES['userImage']['tmp_name'], $url)) {

//******************************************************************       
// Vérification doublon email avant validation du formulaire
       
      $sql = "SELECT * FROM visitor WHERE email = '$email' ";
      $result = $conn->query($sql);
      $row = $result -> fetch_array(MYSQLI_ASSOC);
  
  if (empty($row)){
    // dans ce cas, la requete n'a rien retourné..


    
  }else{
    $valid['success'] = false;
$valid['messages'] = "L'email existe déjà !";
  }  
 // dans ce cas, ALERTE AJAX .. NE MARCHE PAS :( je ne sais pas pourquoi?
 // ******************************************************   
       
       
       
  // Insert into database
    $sql = "INSERT INTO visitor (Name, email, Image) VALUES ('$name','$email','$url')";

    if($conn->query($sql) === TRUE) {
     $valid['success'] = true;
     $valid['messages'] = "Successfully Uploaded";
        
     // dans ce cas, ALERTE AJAX ..  MARCHE  :) 
 // ******************************************************      
    } 
    else {
     $valid['success'] = false;
     $valid['messages'] = "Erreur lors du telechargement";
    }
// dans ce cas, ALERTE AJAX .. NE MARCHE PAS :( je ne sais pas pourquoi?
 // ******************************************************   
    $conn->close();

   }
   else {
    $valid['success'] = false;
    $valid['messages'] = "Error while uploading";
   }
  }
 }

 echo json_encode($valid);

 // upload the file 
}
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

je m'en sors pas vraiment bien c'est trop dure le web :(
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965
Commence par modifier ton appel ajax comme ceci
$.ajax({
  url: form.attr('action'),
  type: form.attr('method'),
  data: formData,
  dataType: 'json',
  cache: false,
  contentType: false,
  processData: false,
  async: false,
  success:function(response) {
    console.log("Reponse ajax",response);
    var success = typeof(response)!='undefined' && typeof(response.success)!='undefined' ? response.success : null;
    var msg = typeof(response)!='undefined' && typeof(response.messages)!='undefined' ? response.messages : "";.

    if(success == true) {
      $("#messages").html('<div class="alert alert-success alert-dismissible" role="alert">'+
      '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>'+
        msg + 
      '</div>');

     $('input[type="text"]').val('');
     $(".fileinput-remove-button").click();
    } else {
      $("#messages").html('<div class="alert alert-warning alert-dismissible" role="alert">'+
        '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>'+
        msg + 
      '</div>');
    }
  },
  error: function(xhr, ajaxOptions, error){
    console.log('ERREUR AJAX',xhr, ajaxOptions, error);
    var errorMessage = xhr.status + ': ' + xhr.statusText
    alert('Error - ' + errorMessage);
  }
});


et côté PHP, je pense que tu peux remplacer ton code par :
<?php


 // database connection
 $server = '127.0.0.1';
 $username = 'root';
 $password = '';
 $dbname = 'base';

 $conn = new mysqli($server, $username, $password, $dbname);
 // check db connection error message NE MARCHE PAS :( je ne sais pas pourquoi? 
 if($conn->connect_error) {
  $valid['success'] = false;
  $valid['messages'] = "Connection Failed : " . $conn->connect_error;
  echo json_encode($valid);
  exit;
 } 

 
 //recupération PROPRE des variables AVANT de les utiliser
 $name = !empty($_POST['fullName']) ? $_POST['fullName']: NULL;
 $lastname = !empty($_POST['lastname']) ? $_POST['lastname']: NULL;
 $email = !empty($_POST['email']) ? $_POST['email']: NULL;
 
 $valid = array('success' => false, 'messages' => array());

 $userImage = !empty($_FILES['userImage']) ? $_FILES['userImage'] : NULL;
 
 if(!$userImage ){
    $valid['success'] = false;
    $valid['messages'] = "Aucun fichier à uploader !";
    echo json_encode($valid);
    exit;
 }
 
 
 $ext = end(explode('.', $fileName));
 $url = '/uploads/files/' . uniqid(rand()) . '.' . $ext;

 if(in_array($ext, array('gif', 'jpg', 'jpeg', 'png'))) {
  if(is_uploaded_file($userImage['tmp_name'])) {
    if(move_uploaded_file($userImage['tmp_name'], $url)) {

      //******************************************************************       
      // Vérification doublon email avant validation du formulaire     
      $sql = "SELECT * FROM visitor WHERE email = '$email' ";
      $result = $conn->query($sql);
      $row = $result->fetch_array(MYSQLI_ASSOC);

      if (empty($row)){
        // dans ce cas, la requete n'a rien retourné..
        // Insert into database
        $sql = "INSERT INTO visitor (Name, email, Image) VALUES ('$name','$email','$url')";
        if($conn->query($sql) === TRUE) {
         $valid['success'] = true;
         $valid['messages'] = "Successfully Uploaded";
            
         // dans ce cas, ALERTE AJAX ..  MARCHE  :) 
     // ******************************************************      
        } else {
          $valid['success'] = false;
          $valid['messages'] = "Erreur lors du l'insertion en bdd";
        }

        
      } else {
        $valid['success'] = false;
        $valid['messages'] = "L'email existe déjà !";
      }  

    }  else {
      $valid['success'] = false;
      $valid['messages'] = "Error while uploading";
     }
  }
 }
 $conn->close();
 echo json_encode($valid);
 exit;  
?>



Puis vide le cache de ton navigateur et refait un essai.
Et si ça ne marche toujours pas, fais une capture de la CONSOLE de ton navigateur et montre la nous.

PS: Je te rappelle que pour débuguer de l'ajax, je te recommande fortement d'utiliser le navigateur firefox ... et surtout.. n'oublie pas d'activer le debugage XHR
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

bonjour
j'ai bien modifier l'appel ajax que vous avez envoyé .
ça ne marche pas :( en plus l'affichage de la miniature a disparus !
je pense que le script Aajax appartient au bouton uplourd image avec l'aperçu de l'image.
es que on doit pas aussi crée un autre appel ajax pour le champs de saisie e-mail ?
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965
dans la console tu vois qu'il y a un message d'erreur au bout de 7 lignes il y a le nom du script ainsi que le numéro ligne concerné si tu cliques dessus ça va te montrer la ligne qui pose problème pourrais-tu nous montrer
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965
l'erreur se trouve à la ligne 13 du code javascript que je t'ai donné comme tu peux le voir il y a un point en trop c'est dû à une erreur de frappe de ma part
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Maintenant faut regarder dans la console pour voir l'erreur...
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
>
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020

sur la Console il y a ça.

error la ligne 267 de ma page y a ça:
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

il me semblait t'avoir demandé d'utiliser le navigateur FIREFOX pour pouvoir correctement débuguer l'ajax ??
Il serait bien de le faire....
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
>
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020

je m'excuse jordane45 la je suis sur Firefox :)


parsererror SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
jQuery 5
Nb
A
c
send
ajax
uploadImg admin:237
la ligne admin :237

     $.ajax({ 


anonymous admin:279
uploadImg(form,formData);

jQuery 2
dispatch
handle
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Je t'avais également demandé d'activer le Debugage XHR
Donc active le, retestes ton script, puis, dans la ligne >post qui va apparaitre, déplie le message puis regarde dans l'onglet Reponse

Cela devrait te donner un peu plus d'infos.

Et au cas où, vérifies bien que ton script PHP ( le fichier contenant le script plus exactement...) soit bien encodé en UTF8
(voir chapitre 1 de ce lien : http://www.commentcamarche.net/faq/47069-html-php-caracteres-accentues-et-l-utf8 )
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Veuillez m'excuser pour le dérangement Jordane45 :( voila ma capture d'écran avec Debugage XHR
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
>
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020

c'est une erreur de ma part j'ai écrasé ma page du formulaire avec le code que vous m'avez envoyé c'est pour ça .
la j'ai le 1er message pop-ub erreur 200
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Ben.. faut revenir à la page contenant ton formulaire
Choisir un fichier ...
Puis voir ce que ça te retourne.

Car ton code, tel qu'il est actuellement, attend OBLIGATOIREMENT que tu selectionnes un fichier si tu veux que ça marche.

Enfin bon,
Pour ma part, je constate que ta question initiale ( concernant le "non affichage" des messagesde ton ajax ) est résolue.
Maintenant, cela concerne le fonctionnement de ton code php....

Merci de mettre cette discussion en RESOLUE
et d'ouvrir (si besoin.. et après que tu aies un minimum cherché par toi même... ) une nouvelle discussion propre à ce "nouveau" problème.
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
>
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020

avant les modifications je pouvais uploadé les image mais j'avais pas de message des doublons email
apré les modifications mon scrip est bloqué sur mon formulaire avec un gros message error 200 :(
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Avant, comme tu le dis, tu ne vérifiais pas le doublon d'email.

Et si tu veux, pouvoir enregistrer, même si tu n'as pas envoyé de fichier, il te suffit de relire le code pour trouver où ça se passe...
Un indice ... il suffit de trouver là où se trouve le texte du message d'erreur que tu vois
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020
>
Messages postés
30125
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020

Je vous remercie pour vote patience à mon égard vous faites un travail considérable <3
Messages postés
26
Date d'inscription
vendredi 6 novembre 2020
Statut
Membre
Dernière intervention
12 novembre 2020

Bonjour Jordane45
je n'arrive plus a me retrouver avec ce script qui fonction plus :( es-que c'est possible de le nettoyer pour moi et le rendre basque html sans code javascript ni css (script brut avec les message d'erreur en echo ? je vous serais reconnaissante si vous pouviez