Requête SQL en 1 clic sans recharger la page [Résolu/Fermé]

Signaler
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020
-
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020
-
Bonjour,

Ça fait des heures que je cherche un script pour m'aider, mais je me retourne vers ce forum dans l’espoir de trouver un réponse.

Je voudrais faire un simple bouton "like" (genre un coeur qui devient rouge et envoi l'information dans ma base SQL quand on clic dessus)

Je connais bien PHP SQL CSS et HTML donc aucun problème pour le faire, c'est juste que je ne veux pas recharger la page à chaque fois, et avec les langages que je connais, c'est impossible.
Il faut utiliser du JS (jquery) je pense, mais dans ce langage je cherche toujours des sources que j'adapte, car je ne connais rien en JS.

Si quelqu'un pourrai m'aider dans mes recherche, ça serai vraiment sympas.


5 réponses

Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Merci jordane45.

Mais le projet ne fonctionne pas !
J'ai copier le content du zip sur mon serveur, j'ai créé la BDD avec les tables, j'ai configuré le fichier config et modifier l'url root dans le fichier monFichierAjax.ajx.php, et j'ai lancé l'index.
Mais j'ai des erreurs sur la page qui rend le projet inutilisable.
Dommage !

Je vais essayé de lire directement dans les fichiers peut être que je trouverai ce que je cherche.
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Salut,
me re voilà après avoir "bien avancé sur mon projet".
Je reviens sur le sujet prêt à repasser un-peut de temps dessus.

Donc je m'étais arrêté à l'erreur 500.
En faite, lorsque j’exécute mon fichier "vote.ajx.php" manuellement, j'ai pas d'erreur, et la requête SQL fonctionne bien.
Mais lorsque j'utilise JS pour l’exécuter j'ai une erreur 500 sur le fichier.

Pour repartir de zéro, voici mes fichiers actuelle :

modules/Gallery/vote.js
function showUser(sid){
var data = {id:sid };
  $.ajax({ 
        type: "POST",
        url: 'modules/Gallery/vote.ajx.php',
        data: data,
        async: true,
        dataType: "json"
  })
  .done(function(reponse){
      console.log(reponse);
      //ici tu peux éventuellement coder le changement
      // de couleur de ton bouton...
      //....
  })
  .fail(function(jqXHR, textStatus){
    alert(textStatus);
 });
}


modules/Gallery/vote.ajx.php
<?php 

global $base, $language, $user;
translate("modules/Gallery/lang/" . $language . ".lang.php");

$sid = !empty($_POST['id']) ? $_POST['id'] : NULL;

if ($sid)
{
$upd = mysql_query("UPDATE " . GALLERY_TABLE . " SET coeur = coeur+1 WHERE sid = '".$sid."'");
}

?>


modules/Gallery/index.php
<?php
    function index()
    {
        global $base, $language, $user;
        
        echo "<script type=\"text/javascript\" src=\"https://code.jquery.com/jquery-3.3.1.js\"></script>";
        echo "<script type=\"text/javascript\" src=\"modules/Gallery/vote.js\"></script>";

  echo "<table><tr>"; 
  $i = -1;

 $sql = mysql_query("SELECT sid, date, pseudo, coeur, vue FROM " . GALLERY_TABLE . " ORDER BY sid DESC LIMIT 0,100");
 while (list($sid, $date, $pseudo2, $coeur, $vue) = mysql_fetch_array($sql))
 {
 $i++;
 
 
 if ($i < 4) {
   echo "<td align=\"center\"><a href=\"upload/Gallery/".$pseudo2."/".$sid.".jpg\" onclick=\"window.open(this.href,'_blank');return false;\"><img src=\"upload/Gallery/".$pseudo2."/".$sid.".jpg\" class=\"zoom\" /></a><br/><a href='' onclick='showUser($sid);'>like</a></td>";
  }
  else {
      echo "</tr><tr><td align=\"center\"><a href=\"upload/Gallery/".$pseudo2."/".$sid.".jpg\" onclick=\"window.open(this.href,'_blank');return false;\"><img src=\"upload/Gallery/".$pseudo2."/".$sid.".jpg\" class=\"zoom\" /></a><br/><a href='' onclick='showUser($sid);'>like</a></td>";
  $i = 0;
  }
 }
echo "</tr></table>";
           
    } 


Sur le fichier "index" j'ai posté que l'essentiel pour éviter de surcharger, et stp pas de commentaire sur l'utilisation de $i lol (c'est du vite fait pour le moment).

Si tu arrive à voir ce qui peux poser problème, ça serai vraiment génial.
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
Qu'as tu dans la console ?
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Dans la console rien avant de cliquer sur un "lien like".
Après, lorsque je clic j'ai ça :

POST http://www.monsite.com/modules/Gallery/vote.ajx.php 500
(Internal Server Error)

send @jquery-3.3.1.js : 9600
ajax @jquery-3.3.1.js : 9206
showUser @vote.js : 3
onclick @index.php?file=Gallery : 82

J'ai regardé à la ligne 82 du fichier index, mais ya rien, déjà ma "function index()" démarre à la ligne 423.
Et pour le reste c'est du JS donc je sais pas.
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
Une erreur 500 indique un souci côté serveur et le plus souvent.. au niveau du code php.
D'où viennent tes variables
global $base, $language, $user;

et ta fonction
translate("modules/Gallery/lang/" . $language . ".lang.php");

Sachant que lorsque tu appelles un fichier php en AJAX ... les constantes, include de fonction et autres... ne sont pas "importés" dans ce fichier.
C'est un peu comme si tu faisais appel à un fichier externe.. (c'est même le principe en fait.....)
Il faut donc, que dans tes fichiers php contactés par ton ajax, inclure à nouveau tes différents fichiers de connexion à ta bdd, les fichiers où tu déclares des fonctions et des variables....

Pour exemple,
remplace le contenu de ton fichier modules/Gallery/vote.ajx.php
par seulement ces quelques lignes :
<?php
$sid = !empty($_POST['id']) ? $_POST['id'] : NULL;
$result = array('POST'=>$_POST);
echo json_encode($result);

puis regarde ce que ça te retourne dans la console après le click.
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Ok, merci.

Alors je avec le script que tu m'as donné sur le fichier "vote.ajx.php" j'ai rien dans la console, et la rien sur le site non plus.

J'ai modifié le fichier pour y mettre ça :

<?php 

$sid = !empty($_POST['id']) ? $_POST['id'] : NULL;

$mysqli = new mysqli('mysql5-10.pro', 'XXXXXXX', 'XXXXXXX', 'XXXXXXX');
if($mysqli->connect_error) {
 die('Erreur de connexion (' . $mysqli->connect_errno . ') ' . $mysqli->connect_error);

if ($sid)
{
$mysqli->query("UPDATE base_gallery SET coeur = coeur+1 WHERE sid = '".$sid."'");
}

?>


Et j'ai de nouveau exactement la même erreur dans la console avec les même fichiers et les même lignes ?
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
Déjà... avec le script que je t'ai donné tu as forcément quelquechose....
Il faut juste savoir regarder.
Si tu utilises CHROME tu dois installer le plugin https://chrome.google.com/webstore/detail/ajax-debugger/lgfefckpdealogpcfjdhinecfbcgedam
Une fois que ça sera fait, lorsque tu vas faire une requête AJAX, tu pourras voir dans la console (dans l'onglet network) le résultat.
Par exemple :


Perso, pour debuguer l'ajax, je préfère largement utiliser firefox.



Ensuite, concernant le fait que tu aies encore une erreur... c'est normal.
Tu as oublié de fermer une accolade et tu mélanges du mysql_ avec du mysqli->
Bref:
<?php
//affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

//initialisation de la variable de retour
$result = array();


//connexion à la bdd
$mysqli = new mysqli('mysql5-10.pro', 'XXXXXXX', 'XXXXXXX', 'XXXXXXX');
if($mysqli->connect_error) {
 $result['erreur'] = 'Erreur de connexion (' . $mysqli->connect_errno . ') ' . $mysqli->connect_error;
}


//récupération PROPRE des variables AVANT de les utiliser
$sid = !empty($_POST['id']) ? $_POST['id'] : NULL;


if ($sid){
  $sql = "UPDATE base_gallery SET coeur = coeur+1 WHERE sid = '".$sid."'";
  $upd = $mysqli->query($sql);
  if (!$upd) {
    $result['erreur'] = "Message d'erreur : %s\n", $mysqli->error);
  }else{
    $result['success'] = $upd;
  }
}


//on retourne au format json le resultat
echo json_encode($result);




Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
Vérifie les options dans la console pour y activer le xhr
Ou installes firefox... On gagnera du temps
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Quand j'active XHR dans la console, j'ai "XHR loaded (vote.ajx.php - 200 OK)"
Et sur FireFox je suis allé sur Développement web puis sur débogueur, mais j'ai pas d'erreur.

J'ai rapidement vu dans google, que l'erreur "parsererror" signifie que il faut du json ?
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894 >
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Vu que dans mon code j'en ai mis....
Si tu continus à avoir ce message d'erreur cela signifie que ton code php retourne une erreur...
As tu biens pris mon code ?

Dans ton JS, fais:
function showUser(sid){
var data = {id:sid };
  $.ajax({ 
        type: "POST",
        url: 'modules/Gallery/vote.ajx.php',
        data: data,
        async: true,
        dataType: "json"
  })
  .done(function(reponse){
      console.log(reponse);
      
  })
  .fail(function(jqXHR, textStatus){
       console.log(textStatus);
       console.log(jqXHR);
       alert(textStatus);
 });
}

les console.log dans le .fail devraient t'afficher plus d'infos dans la console de ton navigateur.
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

ah ben c'est bon, j'ai supprimé la ligne
dataType: "json"
du fichier vote.js
Et plus d'erreur tout fonctionne parfaitement MERCI :)

Puis je abuser de t'as gentillesse, et te demander encore une dernière chose sur ton script JS ?
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Si tu veux bien, voici ma question :

Tu m'as affiché l'emplacement sur le script JS où je peux coder le changement du bouton.
Mais comme j'y connais rien en JS, je sais pas comment faire.
En faite je voudrai simplement afficher un coeur blanc en png et le remplacer un autre coeur rouge après.

  .done(function(reponse){
      console.log(reponse);
      //ici tu peux éventuellement coder le changement
      // de couleur de ton bouton...
      //....
  }


J'ai mis ça :
<img src=\"modules/Gallery/images/coeur1.png\" onclick=\"this.src='modules/Gallery/images/coeur2.png\">


Mais si la requête fonctionne pas, l'image change quand même, et aussi le lien reste actif !
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894

ah ben c'est bon, j'ai supprimé la ligne dataType: "json" du fichier vote.js
Et plus d'erreur tout fonctionne parfaitement MERCI :)

Si tu as été obligé de faire ça... peut-être que ça "marchouille...." mais ce n'est pas la meilleur solution.
Si tu as du json parse failed .. c'est que ton code dans ton fichier vote.ajx.php retourne du text qu'il ne devrait pas....
La seule façon de le savoir est d'ajouter les console.log que je t'ai indiqué et de nous dire ce qu'ils t'affichent exactement.
Le plus souvent c'est lié à des erreurs dans le code php (parfois juste des warning ou des notice )
Il faudrait aussi nous montrer le code que tu as réellement utilisé dans ton fichier vote.ajx.php ... j'ai l'impression que tu n'as pas pris le mien.

Pour ton autre question... sache qu'ici il est préférable de ne poser qu'une question par discussion.
Ca permet, à d'autres visiteurs, de pouvoir chercher/trouver des réponses à leurs propres questions pour peu que ton souci soit équivalent au leur.
De toutes façons, le code
 $(this).prop('src','modules/Gallery/images/coeur2.png')

serait a placer là où je t'avais mis le texte
//ici tu peux éventuellement coder le changement
      // de couleur de ton bouton...
      //....

C'est à cet endroit précis que tu dois exécuter une action SI (et seulement si) ton code a fonctionné.
Sinon, là où tu l'as mis c'est exécuté systématiquement....


Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Pour ceux qui peuvent avoir besoins, voici les sources final simplifier :

Dans le fichier PHP de la page :
echo "<script type=\"text/javascript\" src=\"modules/Gallery/jquery-3.3.1.js\"></script>";
echo "<script type=\"text/javascript\" src=\"modules/Gallery/vote.js\"></script>";

echo "<a href='javascript:void(0)' onclick='showUser($sid);'>like</a>";


Le fichier modules/Gallery/vote.js
function showUser(sid){
var data = {id:sid };
  $.ajax({ 
        type: "POST",
        url: 'modules/Gallery/vote.ajx.php',
        data: data,
        async: true,
  })
  .done(function(reponse){
      console.log(reponse);
      //ici tu peux éventuellement coder le changement
      // de couleur de ton bouton...
      //....
  })
  .fail(function(jqXHR, textStatus){
    alert(textStatus);
 });
}


Et le fichier modules/Gallery/vote.ajx.php
<?php 

$sid = !empty($_POST['id']) ? $_POST['id'] : NULL;

$mysqli = new mysqli('localhost', 'user', 'password', 'name');
if($mysqli->connect_error) {
	die('Erreur de connexion (' . $mysqli->connect_errno . ') ' . $mysqli->connect_error);
	}

if ($sid)
{
$mysqli->query("UPDATE votre_table SET coeur = coeur+1 WHERE sid = '".$sid."'");
}

?>


J’espère que j'ai rien oublié.
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
En gros... tu n'as tenu compte d'aucun de mes codes .........
- Il n'y as pas les console.log dans le fail de ton js
- Tu ne gères pas les éventuelles erreurs de requêtes dans ton fichier ajax.php
- Tu n'a pas mis le changement d'image dans le done du JS

Sans compter que tu ne répondais que partiellement aux questions que je te posais....
Bref... Désormais je passe mon tour .....

Bonne chance pour la suite....
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Je suis vraiment désolé, pourtant je t'ai dis que le code du fichier vote.ajx.php que tu avais modifié ne fonctionnait pas alors que l'autre avec l'accolade qui manquait fonctionné, j'ai donc pensais évident de conserver celui qui fonctionnait.

Bref, dans tous les cas merci beaucoup pour ton aide.
Et désolé d'avoir laissé plané un climat d'incompréhension, c'été pas mon intention.
Messages postés
29898
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 octobre 2020
2 894
pour tes prochains codes, pense à lire et à appliquer ceci
https://www.commentcamarche.net/faq/48399-php-gestion-des-erreurs-debogage-et-ecriture-du-code
Messages postés
69
Date d'inscription
mardi 16 janvier 2018
Statut
Membre
Dernière intervention
2 mai 2020

Ok, je vais le faire.
Merci