Repositionnement du scroll après submit (JS+PHP)

Fermé
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 - 26 oct. 2017 à 10:01
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 - 28 oct. 2017 à 20:39
Bonjour,

Après de très nombreuses recherches, j'essaie de repositionné le scroll après avoir cliqué sur un button type submit (qui execute une requete sql)

Pour être plus précis, j'ai une boucle qui affiche des utilisateurs (tout est affichés dans un div), et dans chaque div, il y a un button submit qui permet de faire une demande d'amis (donc je fais une requete sql pour inserer dans la bdd), le name du button est ajout_amis_1, ajout_amis_2, ajout_amis_3 ....

La requete sql fonctionne mais j'aimerai que quand on clique sur le button submit, il recupere la position du scroll, qui la sauvegarde quelque part, qui execute la requete sql, qui fasse sa redirection, et pour terminé, qui place le scroll exactement là où il était !!!

J'espère que j'ai bien expliqué la situation.

Merci d'avance.
A voir également:

9 réponses

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
26 oct. 2017 à 10:05
Bonjour

Il serait préférable, je pense, d'utiliser de l'ajax au lieu de faire des submit...
Tu n'aurais plus de souci de scroll ni de rechargement de page inutil...
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
26 oct. 2017 à 10:18
Merci beaucoup, mais je sais pas vraiment comment faire.
Avec ajax, je pourrai aussi faire les requetes sql ???
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
26 oct. 2017 à 11:16
Oui.

L'ajax, sans te faire un cours complet ... c'est la possibilité d'appeler des scripts côté serveur (en php par exemple) depuis du JAVASCRIPT.

Le mieux (selon moi) pour faire de l'ajax, est d'utiliser la librairie JQUERY.
Voici un exemple d'ajax complet : https://forums.commentcamarche.net/forum/affich-33258760-remplir-un-formulaire-dynamiquement-en-fonction-d-une-combobox#2


Tu en trouveras d'autres sans mal sur internet...
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
26 oct. 2017 à 11:31
Ou la la !!! Je n'ai pas trop compris, le code ce place bien avant <body>

Peut-tu me traduire le code ajax stp

Merci en tout cas
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
26 oct. 2017 à 11:55
Le code JS :
Il est préférable de placer ses codes javascript à la fin de ses pages.
donc JUSTE AVANT le </body>

Le code PHP :
Celui qui sera utilisé par l'ajax, est placé dans un fichier à part.
Ce fichier (dans l'exemple que je t'ai donné se nomme client.php )

Après.. ce n'est qu'un exemple "complet" de code ajax ....
Tu trouveras des tutos et des exemples sur le net.....
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
26 oct. 2017 à 12:55
Je vais regarder ça en détail
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
26 oct. 2017 à 12:28
Salut,

Sinon tu peux simplement utiliser un système d'ancres en ajoutant un attribut id pour chaque div utilisateur et en redirigeant vers cette ancre lors du submit.
https://www.alsacreations.com/astuce/lire/5-lien-precis-page-ancre-anchor-diese.html

Bonne journée,
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
26 oct. 2017 à 12:57
Je essayer de cette manière, mais le souçi, c'est que ça ne fait pas vraiment beau.

Ce que je veux dire c'est que si l'element est à 590px et le scroll à 620px, l'ancre sera à 590px donc c'est correct mais pas assez précis !

Merci quand même
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
Modifié le 26 oct. 2017 à 14:10
Bon bah, je n'ai toujours pas réussi à faire ce que voulais.

Quelqu'un pourrai m'aider pour l'AJAX ou si vous avez une idée, je veux bien.
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 09:41
Alors ???
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
27 oct. 2017 à 10:50
alors quoi ?

Si tu as essayé de faire l'ajax ... tu peux donc nous montrer le code que tu as testé...
Sans ça.. je ne pourrais pas t'aider (car non.. ici nous ne fournissons pas du tout cuit...).
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 10:54
J'ai aussi poser la question sur oenclassroom, et j'ai dit :
"Je suis désolé de poser autant de question, mais j'aimerai comprendre le code et non recopier sans interets !" donc non je ne veux pas la solution direct, je veux comprendre la methode pour que je puissent la reproduire sans tout le temps poser des questions sur les forums.
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 10:55
Je vais te montrer ce que j'ai essayé
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
Modifié le 27 oct. 2017 à 14:37
Pour commencer, j'ai mis le code php dans un fichier appelé ajout_amis.php :
<?php
if(isset($_POST['ajout_amis_'.$i])) {
     $getfollowedid = intval($info_membre['id']);
     if($getfollowedid != $_SESSION['id']) {
          $dejafollowed = $bdd->prepare('SELECT * FROM nom_table WHERE id_follower = ? AND id_following = ?');
          $dejafollowed->execute(array($_SESSION['id'], $getfollowedid));
          $dejafollowed = $dejafollowed->rowCount();
          if($dejafollowed == 0) {
               $addfollow = $bdd->prepare('INSERT INTO nom_table (id_follower, id_following, progress) VALUES (?, ?, ?)');
               $addfollow->execute(array($_SESSION['id'], $getfollowedid, '1'));
          } elseif($dejafollowed == 1) {
               $deletefollow = $bdd->prepare('DELETE FROM nom_table WHERE id_follower = ? AND id_following = ? AND progress = ?');
               $deletefollow->execute(array($_SESSION['id'], $getfollowedid, '1'));
          }
     }

}
?>

EDIT : Ajout du LANGAGE dans les balises de code

Donc quand je clique sur le button ajout_amis, il execute sur code, il faudrai utiliser ajax pour eviter la redirection comme tu me l'a preciser precedemment.

Merci beaucoup !
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
27 oct. 2017 à 14:39
Déjà .. deuxième ligne de ton code :
d'où vient la variable $info_membre ?

Ensuite.. tu sembles utiliser les variables de SESSION ... où es ton session_start ?

Pour finir ... avant de poursuivre .. je t'invite à lire et à appliquer ceci : https://forums.commentcamarche.net/forum/affich-37584947-php-gestion-des-erreurs-debogage-et-ecriture-du-code
et ceci :https://forums.commentcamarche.net/forum/affich-37584941-php-pdo-gerer-les-erreurs
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 14:42
Ce code est lié à la page principale, oui il y a bien le session_start(), par contre je n'ai pas mis la gestion des erreurs effectivement.
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
27 oct. 2017 à 15:15
Ce code n'est pas lié à aucune autre page .... vu que tu l'appelles via de l'ajax.
Cette page est donc totalement indépendante ...
Il faut donc bien y mettre :
Le démarrage des sessions et La connexion à la bdd ..
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 14:46
$info_membre est une variable que j'ai utilisé pour faire le fetch(), donc il contient toutes les informations nécessaires de la bdd.

Ex : $info_membre['departement'];
Et il affiche le dépratement du membre.

Ce code fonctionne sans problème
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
27 oct. 2017 à 16:39
Voila ton code amélioré :
<?php
session_start();

//affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

//connexion à la bdd
require_once "tonfhcierdeconnexionalabdd.php";


//fonctions

function querySelect($sql,$datas=NULL){
	global $bdd;
	$result = NULL;
	try{
		$prepare = $bdd->prepare($sql);
		$prepare->execute();
		//retourne le resultat dans un Array
		$result = $prepare->fetchAll(); 
	}catch(Exception $e){
		echo "Erreur ! " .$e->getMessage();
	}
  return $result;	
}

function queryExec($sql,$datas=NULL){
	global $bdd;
	$result = NULL;
	try{
		$prepare = $bdd->prepare($sql);
		$result = $prepare->execute();
	}catch(Exception $e){
		echo "Erreur ! " .$e->getMessage();
	}
  return $result;
}

function get_dejafollowed($id_follower,$id_following){
	$sql = 'SELECT * FROM nom_table WHERE id_follower = ? AND id_following = ?';
	$datas = array($id_follower, $id_following);
	$dejafollowed = querySelect($sql,$datas);
	return !empty($dejafollowed) ? count($dejafollowed) : 0;
}

function insertFollow($id_follower,$id_following){
	$sql = 'INSERT INTO nom_table (id_follower, id_following, progress) VALUES (?, ?, ?)';
	$datas = array($id_follower,$id_following,1);
	return queryExec($sql,$datas);
}

function deleteFollow($id_follower,$id_following){
    $sql = 'DELETE FROM nom_table WHERE id_follower = ? AND id_following = ? AND progress = ?'
	$datas = array($id_follower,$id_following,1);
	return queryExec($sql,$datas);
}


//début du traitement
$ajoutAmis = !empty($_POST['ajout_amis_'.$i]) ? $_POST['ajout_amis_'.$i] : NULL; // variable post
$user_id = !empty($_SESSION['id']) ? $_SESSION['id'] : NULL; // variable desession
$getfollowedid = !empty($info_membre['id']) ? intval($info_membre['id']) : NULL; // $info_membre n'est défini nul part....
 
if($ajoutAmis && $user_id && $getfollowedid) {
     
     if($getfollowedid != $user_id) {
		  $dejafollowed = get_dejafollowed($user_id,$getfollowedid)
		  
          if($dejafollowed == 0) {
               insertFollow($user_id,$getfollowedid)
          } elseif($dejafollowed == 1) {
               deleteFollow($user_id,$getfollowedid)
          }
     }

}
?>

Il n'en reste pas mois que la variable $info_membre sort de nul-part...
Il faut que tu la remplaces par autre chose... sûrement une variable POST...
Mais pour t'en dire plus il faudrait que tu nous montres également le code côté html et javascript (celui que tu as écrit pour l'ajax...)

0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
Modifié le 27 oct. 2017 à 17:24

<?php
session_start();
$bdd = new PDO('mysql:host=christephvallee.sql.free.fr;dbname=christephvallee', 'christephvallee', '07juillet');
$bdd->exec("SET NAMES 'utf8'");

error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);
?>

Code du session, connexion à la bdd et affichage des erreurs du fichier : profil.php

Ceci est tout le reste du code php du fichier : profil.php

if(isset($_POST['search'])) {
if(($_POST['criteres_department']) && !empty($_POST['criteres_department'])){
$Col1_Array = $_POST['criteres_department'];

foreach($Col1_Array as $selectValue){
//affichage des valeurs sélectionnées
$pieces = explode("/", $selectValue);
for ($i = 0; $i <= 10; $i++) {
if($pieces[$i] != '') {
$departement_search = $bdd->query('SELECT * FROM nom_table where departement = "'.$pieces[$i].'" AND sexe = "'.$_SESSION['cherche_sexe'].'"');
while ($info_membre = $departement_search->fetch()) {
?>
<div id = "affiche_membre"><br />
<img src = "membres/<?php echo $info_membre['avatar']; ?>" style = "border-radius: 50%; height: 108px; position: absolute; top: 7px; left: 15px;" />
<label style = "margin-left: 150px; color: #FF8300; font-family : AR CENA2; font-size: 24pt; font-weight: lighter;"><?php echo $info_membre['pseudo']; ?></label><br /><label style = "margin-left: 150px; color: #404040; font-size: 16pt; font-family: AR CENA2; font-weight: lighter;"><?php echo $info_membre['ddn']; ?></label><br />
<label style = "margin-left: 150px; color: #404040; font-size: 16pt; font-family: AR CENA2; font-weight: lighter;">40 ans</label>
<label style = "left: 350px; color: #FF8300; font-size: 20pt; font-family: AR CENA2; font-weight: lighter; position: absolute; top: 17px;">Critères : <span style = "color: #404040;"><?php echo $info_membre['departement']; ?></span></label>
<?php
if(isset($_SESSION['id']) AND $_SESSION['id'] != $info_membre['id']) {

$isfollowingornot2 = $bdd->prepare('SELECT * FROM nom_table WHERE id_follower = ? AND id_following = ?');
$isfollowingornot2->execute(array($_SESSION['id'], $info_membre['id']));
$isfollowingornot = $isfollowingornot2->fetch();

if($isfollowingornot['progress'] == '1') {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 22pt; color: #404040; background: transparent;" class="fa fa-user-times"></button>
<?php
} elseif($isfollowingornot['progress'] == '') {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">person_add</button>
<?php
} elseif($isfollowingornot['progress'] == '2' ) {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">check_circle</button>
<?php
} else {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">person_add</button>
<?php
}
}
?>

<button name = "message_<?php echo $i; ?>" id = "message_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 65px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">message</button>

<?php
include 'ajout_amis.php';
?>
</div><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<?php
}
}
break;
}
}
}
}
} else {
$departement_search = $bdd->query('SELECT * FROM nom_table where sexe = "'.$_SESSION['cherche_sexe'].'"');
$i = 0;
while ($info_membre = $departement_search->fetch()) {
?>
<div id = "affiche_membre"><br />
<img src = "membres/<?php echo $info_membre['avatar']; ?>" style = "border-radius: 50%; height: 108px; position: absolute; top: 7px; left: 15px;" />
<label style = "margin-left: 150px; color: #FF8300; font-family : AR CENA2; font-size: 24pt; font-weight: lighter;"><?php echo $info_membre['pseudo']; ?></label><br /><label style = "margin-left: 150px; color: #404040; font-size: 16pt; font-family: AR CENA2; font-weight: lighter;"><?php echo $info_membre['ddn']; ?></label><br />
<label style = "margin-left: 150px; color: #404040; font-size: 16pt; font-family: AR CENA2; font-weight: lighter;">40 ans</label>
<label style = "left: 350px; color: #FF8300; font-size: 20pt; font-family: AR CENA2; font-weight: lighter; position: absolute; top: 17px;">Critères : <span style = "color: #404040;"><?php echo $info_membre['departement']; ?></span></label>
<?php
if(isset($_SESSION['id']) AND $_SESSION['id'] != $info_membre['id']) {

$isfollowingornot2 = $bdd->prepare('SELECT * FROM nom_table WHERE id_follower = ? AND id_following = ?');
$isfollowingornot2->execute(array($_SESSION['id'], $info_membre['id']));
$isfollowingornot = $isfollowingornot2->fetch();

if($isfollowingornot['progress'] == '1') {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 22pt; color: #404040; background: transparent;" class="fa fa-user-times"></button>
<?php
} elseif($isfollowingornot['progress'] == '') {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">person_add</button>
<?php
} elseif($isfollowingornot['progress'] == '2' ) {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">check_circle</button>
<?php
} else {
?>
<button name = "ajout_amis_<?php echo $i; ?>" id = "ajout_amis_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">person_add</button>
<?php
}
}
?>

<button name = "message_<?php echo $i; ?>" id = "message_<?php echo $i; ?>" type = "submit" style = "padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 65px; font-size: 26pt; color: #404040; background: transparent;" class="material-icons">message</button>

<?php
include 'ajout_amis.php';
?>
</div><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<?php
$i++;
}
}


Donc cette boucle, il vérifie si on a cliqué sur le button search, si oui, il affiche tous les membres (photo, pseudo, date de naissance, age fausse (40ans) en respectant les critères (ex: département). Il affiche aussi deux icones, un icone qui permettra d'envoyer un message (pas encore en fonctions) et l'autre icone, va demander la personne en ami. Et c'est ici, qu'il recharge la page !!!

progress 1 = demande envoyé, en attente de réponse
progress 2 = demande accepté, les deux membres sont amis


Si l'utilisateur n'a pas cliqué sur le button search, il affiche les membres sans respecter le département.... On peux quand meme faire une demande d'amis...

Résumé :
J'aimerai que lorsqu'on clique sur l'icone pour effectué une demande d'amis, il execute le code sans rechargement, et mettre à jour l'icone !

Car jusque maintenant, il recharge la page, donc si l'utilisateur effectue une demande d'amis à la 15 personnes, après rechargement, la scrollbar est retourné en haut, il l'icone n'est plus à jour.

progress = 1 donc icone = ... class = "fa fa-user-times"></button>
progress = 0 donc icone = ... class = "material-icons">person_add</button>
progress = 2 donc icone = ... class = "material-icons">check_circle</button>

(Dit moi si tu veux plus d'informations concernant les icônes)
J'espère que j'ai bien détaillé et expliqué.

Merci d'avance
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
27 oct. 2017 à 20:23
Il faut retirer les submit et gérer avec du javascript
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 21:11
Des buttons c'est suffisant ? Pour gérer le JavaScript, j'utilise un onclick ?
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
27 oct. 2017 à 21:14
Oui très bien
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
27 oct. 2017 à 23:52
Alors, j'ai enlever le type = "submit" du button (progress 0, 1 ou 2), et ajoute un onclick pour chacun.

onclick = "ajout_amis_p1();" pour le button progress 1.
onclick = "ajout_amis_p0();" pour le button progress 0.
onclick = "ajout_amis_p2();" pour le button progress 2.

Tu me conseille de mettre cette fonction dans profil.php où chaque fonction dans son propre fichier .js

Quel est le mieux ?

Merci
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
28 oct. 2017 à 09:22
Une seule et même fonction appelée depuis les boutons.
Ajout_ami(id);
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
28 oct. 2017 à 11:45
J'ai fait tu m'a dit à propos de la fonction et du button, c'est vrai que c'est plus pratique de faire avec une seule fonction. Donc si j'ai bien compris, dans cette fonction, je mets le code du ficher ajout_amis.php, que je te montrait précédemment ? (requete sql...)

En mettant ceci dans la fonction ajout_amis, je pourrai donc supprimer le fichier ajout_amis.php ?

Aucun rechargement de page sera effectué ? Car juste en mettant un :

alert('Bonjour');


Il recharge la page au moment, où je clique sur le button "OK".
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
28 oct. 2017 à 16:33
Tu persistes a faire du submit.... Et non de l'ajax
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
Modifié le 28 oct. 2017 à 16:38
Pour l'AJAX, j'utilise la fonction $.AJAX ?
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
28 oct. 2017 à 16:41
Oui
Commr l'exemple que je t'ai donné
Bien entendu tu charges jquery dans ta page
Et tu retires les type="submit" de tes boutons.
Sans oublier de placer le code php dans un autre fichier
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
28 oct. 2017 à 16:44
Ok je vais essayer ça, et là normalement il y aura plus de problème de rechargement ?
0
FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019 14
28 oct. 2017 à 16:45
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > FlorianJ29 Messages postés 68 Date d'inscription dimanche 22 janvier 2017 Statut Membre Dernière intervention 28 février 2019
28 oct. 2017 à 17:05
Bof
Mais si tu le comprends ça ira
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
Modifié le 28 oct. 2017 à 20:39
Bon...
N'es tu pas capable de lire des tutos et d'appliquer les exemples que je te donne ?
Ne sais tu pas copier/coller les codes que je prend le temps de d'écrire au lieu d'écrire n'importe quoi ?
Où sont passé les fonctions que j'ai créé ?? où as tu appliqué les conseils que je t'ai donné ??

Bref...je vais te le donner tout fait le code... on va gagner de temps et ça sera plus propre...


Dans un fichier à part, tu places le code de connexion à la bdd.
Ca t'évitera de devoir le copier/coller n'importe où dans les pages de ton site vu que tu n'araus
qu'à inclure ce fichier là où tu en auras besoin.
(cela permet également de n'avoir à le modifier qu'à un seul endroit si jamais tu changeais de bdd.....)

J'inclus, dans ce fichier, des fonctions pour exécuter les requêtes.
Ca évitera d'avoir à réécrire les blocs TRY/CATCH à chaque fois...
<?php
//Fichier cnxbdd.php

/**
* Fonction de connexion à la bdd
* retourne la connexion.
*/
function connexion(){
  $pdo = NULL;
  
  //variables de connexion à la bdd (à modifier par tes soins)
  $host = "christ .... .free";
  $user = "christephvallee";
  $pwd  = "tonPassword";
  $base = "christephvallee";
  try{
    $pdo =new PDO('mysql:host='.$host.';dbname='.$base.'; charset=utf8', $user, $pwd);
    // Activation des erreurs PDO
     $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    // mode de fetch par défaut : FETCH_ASSOC / FETCH_OBJ / FETCH_BOTH
     $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_ASSOC);
  } catch(PDOException $e) {
    // en cas de pb pour la connexion
    die('Erreur : ' . $e->getMessage());
  }
  return $pdo;
}



/**
*pour faire un SELECT
* Retourne le résultat dans un array
*/
function querySelect($sql,$datas=NULL){
  $bdd = connexion();
  $result = NULL;
  //Execution de la requete
  try{
    $requete = $bdd -> prepare($sql) ;
    $requete->execute($datas) ;
    //on stocke le résultat de la requête dans un array
    $result = $requete->fetchAll();
  }catch(Exception $e){
    // en cas d'erreur :
     echo " Erreur ! ".$e->getMessage();
     echo " Les datas : " ;
    print_r($datas);
  }
 return $result;
}

/**
* Pour faire des insert/update/delete
* Mettre lastInsertId à true si on veut l'ID nouvellement créé lors d'une requête INSERT
*/
function queryExec($sql,$datas=NULL,$lastInsertId = false){
  $bdd = connexion();
  $result = NULL;
  //Execution de la requete
  try{
    $requete = $bdd -> prepare($sql) ;
    $query = $requete->execute($datas) ;
    $result = ($query && $lastInsertId == true) ? $bdd->lastInsertId() : $query;
  }catch(Exception $e){
    // en cas d'erreur :
     echo " Erreur ! ".$e->getMessage();
     echo " Les datas : " ;
    print_r($datas);
  }
 return $result;
}

?>



Ensuite, le script PHP qui sera apelé par ton javascript (ajax)

<?php
//fichier gestion_amis.php
session_start();

//affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

//connexion à la bdd
require_once "cnxbdd.php";

//-------------------------------------------//
// Fonctions
//-------------------------------------------//

function get_dejafollowed($id_follower,$id_following){
 $sql = 'SELECT * FROM nom_table WHERE id_follower = ? AND id_following = ?';
 $datas = array($id_follower, $id_following);
 $dejafollowed = querySelect($sql,$datas);
 return !empty($dejafollowed) ? count($dejafollowed) : 0;
}

function insertFollow($id_follower,$id_following,true){
 $sql = 'INSERT INTO nom_table (id_follower, id_following, progress) VALUES (?, ?, ?)';
 $datas = array($id_follower,$id_following,1);
 return queryExec($sql,$datas);
}

function deleteFollow($id_follower,$id_following){
    $sql = 'DELETE FROM nom_table WHERE id_follower = ? AND id_following = ? AND progress = ?'
 $datas = array($id_follower,$id_following,1);
 return queryExec($sql,$datas);
}




//-------------------------------------------//
//début du traitement
//-------------------------------------------//

// récupération PROPRE des variables
 $ajoutAmis = !empty($_POST['ajoutAmis']) ? $_POST['ajoutAmis'] : NULL; // variable post
 $user_id = !empty($_SESSION['id']) ? $_SESSION['id'] : NULL; // variable desession
 $getfollowedid = !empty($info_membre['id']) ? intval($info_membre['id']) : NULL; // $info_membre n'est défini nul part....
 $result = NULL;
// traitement...
if($ajoutAmis && $user_id && $getfollowedid) {
     
  if($getfollowedid != $user_id) {
    $dejafollowed = get_dejafollowed($user_id,$getfollowedid)

    if($dejafollowed == 0) {
         $result = insertFollow($user_id,$getfollowedid)
    } elseif($dejafollowed == 1) {
         $result = deleteFollow($user_id,$getfollowedid)
    }
  }
}

//renvoi des données vers le JS au format JSON
echo json_encode($result);

?>


Puis, dans la page qui contient les "boutons":
 <button id="ajout_amis_<?php echo $i; ?>" 
         type="button" 
         style="padding: 5px; border: 2px solid #606060; border-radius: 5px; cursor: hand; position: absolute; right: 15px; top: 7px; font-size: 22pt; color: #404040; background: transparent;" 
         class="fa fa-user-times ajout_amis"
         data-iduser="<?php echo $i; ?>">
 </button>

et le code JS qui va avec (que tu peux placer entre balises script à la fin de ta page ou le mettre dans un fichier js à part..comme tu veux)
var urlAjx = "gestion_amis.php";
//lorsque l'on clique sur un élément qui contient la class : 'ajout_amis'
$(".ajout_amis").click(function(){
  var id = $(this).data('iduser');
  
  //les données qu'on va envoyer en post via ajax:
  var data = {ajoutAmis:id};
  
  //on lance l'ajax:
   $.ajax({ 
      type: "POST",
      url: urlAjx,
      data: data,
      async: true,
      dataType: "json",
      success: function(reponse){
         console.log(reponse);
         //ici tu peux ajouter du code JS pour modifier l'image, le bouton.. 
         // bref.. faire ce que tu souhaites une fois que l'amis à été ajouté
         // ...
         //...
         
       },
      error:function(jqXHR, textStatus){
        alert('ERREUR AJAX :' + jqXHR.status + ' - '  + textStatus);
     }); 
});



Voila ..
je l'ai écris de tête... il peux y avoir des peties erreurs de syntaxe... je te laisse les corriger.

NB0 : N'oublie pas de charger JQUERY dans ta page...
Tu peux le télécharger ici : https://code.jquery.com/jquery-3.2.1.min.js (tu l'enregistres dans le répertoire de ta page html)
Et pour le charger dans ta page :
<script type="text/javascript" src="jquery-3.2.1.min.js"></script>


NB1 : Tu as mis pleins de "styles" dans tes "button" ... utilises des class ça sera plus propre !

NB2 : En regardant le code qui te permet d'afficher ta "liste".. je pense ne pas me tromper si je te dis que c'est le "bordel".
Tu répètes plusieurs fois les mêmes blocs...
J'ai l'impression que tu stockes toutes les infos dans une seule table..
Bref.. complètement à revoir !

Tu as fais un MCD ?? montre le nous !

Sachant que je gérerai ça avec au moins 3 tables :
table departement (id, nom )
talble users(id,nom,prenom,email,id_departement,date_naissance,sexe)
table amis (id_follower, id_following, progress) *id_follower et id_following correpondant à des ID de la table users

NB3 : concernant cette portion de code:
$Col1_Array = $_POST['criteres_department'];

     foreach($Col1_Array as $selectValue){
     //affichage des valeurs sélectionnées
          $pieces = explode("/", $selectValue);
          for ($i = 0; $i <= 10; $i++) {

1 - Au lieu de faire des boucles de 1 à 10 ... ne connais tu pas les "foreach" ??
2 - Comment tu fais pour stocker les département dans une seule variable ??? Ne sais tu pas utiliser les input de forme 'array' ??
3 - Lorsque tu fais des requêtes SQL .. il existe une instruction IN... cela t'évitera de faire des requêtes dans des boucles... Non seulement c'est crade.. mais en plus c'est plus lent !
par exemple tu pourrais avoir un truc du genre :
// Récupération PROPRE des variables AVANT de les utiliser
$userID = !empty($_SESSION['id']) ? $_SESSION['id'] : NULL;
$search = !empty($_POST['search']) ? $_POST['search'] : NULL;
$Col1_Array = !empty($_POST['criteres_department']) ? $_POST['criteres_department'] : NULL;
$cherche_sexe = !empty($_SESSION['cherche_sexe']) ? $_SESSION['cherche_sexe'] : NULL;

if($search) {

    $array_departement = array();
    foreach($Col1_Array as $selectValue){
      $arr_selectValue  = explode("/", $selectValue);
      array_merge($array_departement, $arr_selectValue);
    }    
    //on transforme l'array en STRING séparée par des ','
    $strWhere = join("','",$arr_selectValue);
    
    //si la variable $cherche_sexe n'est pas vide :
    $strAnd = $cherche_sexe ? " AND sexe = '".$cherche_sexe."' " : "";
    
    // si on a l'id du user ($_SESSION[id])
    $strAnd .= $userID ? " AND id <> '".$userID."' " : "";
    
     //on 'fabrique' la requête en fonction des variables disponibles
     $sql = "SELECT * 
             FROM nom_table 
             WHERE departement IN ('".$strWhere."') 
             ".$strAnd."";
     
     
      //on exécute la requête en utilisant les fonctions du fichier de connexion
      $arr_result = querySelect($sql);
      
      //maintenant.. on parcours l'array pour faire l'affichage
      foreach($arr_result as $info_membre){
        //ici tu places tes boutons...
        
      }
      


Et pour finir ...
Si jamais le code ne semble pas fonctionner.... pense à regarder dans la console de ton navigateur (F12 en général pour l'ouvrir).
Si tu utilises CHROME, pense à installer avant le plugin : AJAX Debugger ( https://chrome.google.com/webstore/detail/ajax-debugger/lgfefckpdealogpcfjdhinecfbcgedam )


Cordialement, 
Jordane                                                                 
0