Bonjour à tous

J'espère que je suis dans la bonne section.

J'ai un problème avec de l'Ajax. En fait, je voudrais créer un bouton "suivre" qui, lorsqu'on clique dessus envoie des données en post à un script en php qui les envoie dans la bdd, puis le bouton passe en "ne plus suivre". Lorsqu'on clique sur ne plus suivre, le javascript envoie les données du formulaire en post à un autre script en php qui update la bdd. Ce n'est peut-être pas très clair expliqué ainsi
J'ai trouvé une solution super crade pour faire ça mais je pense que vous pourrez m'aider à faire bien bien mieux. En plus au bout de 3 clics d'affilés sur le dit bouton il y a un rechargement de la page (que je ne voudrais pas). Ma solution n'est pas la bonne...

Voilà le html :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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
<div id="follow">
<?php
if ($friendsql[0] == $_SESSION['login'])
        {
?> 
	<form method="post", action="#" id="formcom2">
	<input type="hidden" name="loginpage" value="<?php echo $login ?>">
	<input type="hidden" name="login" value="<?php echo $_SESSION['login'] ?>">
	<input type="submit" class="neplussuivre" value="- Ne plus suivre"/>
	</form> 
 
	<div id="newdiv" style="display: none;">
	<form method="post", action="#" id="formcom2">
	<input type="hidden" name="loginpage" value="<?php echo $login ?>">
        <input type="hidden" name="login" value="<?php echo $_SESSION['login'] ?>">
	<input type="submit" class="neplussuivre" value="- Ne plus suivre"/>
	</form>
	</div>
 
	<div id="newdiv2" style="display: none;">
		<form method="post", action="#" id="formcom">
		    <input type="hidden" name="loginpage" value="<?php echo $login ?>">
		     <input type="hidden" name="login" value="<?php echo $_SESSION['login'] ?>">
		      <input type="submit" class="suivre" value="+ Suivre"/>
		   </form>
	</div>
<?php   
                }
        else
               {
?> 
	<form method="post", action="#" id="formcom">
		<input type="hidden" name="loginpage" value="<?php echo $login ?>">
		<input type="hidden" name="login" value="<?php echo $_SESSION['login'] ?>">
		<input type="submit" class="suivre" value="+ Suivre"/>
		</form>
		<div id="newdiv" style="display: none;">
				<form method="post", action="#" id="formcom2">
				<input type="hidden" name="loginpage" value="<?php echo $login ?>">
				<input type="hidden" name="login" value="<?php echo $_SESSION['login'] ?>">
				<input type="submit" class="neplussuivre" value="- Ne plus suivre"/>
				</form>
		</div>
		    <div id="newdiv2" style="display: none;">
			<form method="post", action="#" id="formcom">
					<input type="hidden" name="loginpage" value="<?php echo $login ?>">
					<input type="hidden" name="login" value="<?php echo $_SESSION['login'] ?>">
					<input type="submit" class="suivre" value="+ Suivre"/>
			</form>
			</div>

Ne criez pas je sais que c'est horrible

Les deux scripts js (un pour suivre et l'autre pour ne plus suivre) :

Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
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
$(function() {
	$("#formcom").submit(function(){
		login = $(this).find("input[name=login]").val();
		loginpage = $(this).find("input[name=loginpage]").val();
		$.post("scripts/follow.php", {login: login, loginpage: loginpage}, function(data) {
			if(data != "ok")
			{
				$(".error").empty().append(data);
			}
			else
			{
				//$("#resultatAjax").hide().append(login+" a follow : "+loginpage).slideDown();
				$("#formcom").hide();
				$("#newdiv").show();
			}
		});
		return false;
	});
});
$(function() {
	$("#formcom2").submit(function(){
		login = $(this).find("input[name=login]").val();
		loginpage = $(this).find("input[name=loginpage]").val();
		$.post("scripts/unfollow.php", {login: login, loginpage: loginpage}, function(data) {
			if(data != "ok")
			{
				$(".error").empty().append(data);
			}
			else
			{
				//$("#resultatAjax").hide().append(login+" a follow : "+loginpage).slideDown();
				$("#formcom2").hide();
				$("#newdiv2").show();
			}
		});
		return false;
	});
});

Et les deux php :

Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
include('../../config.php');
 
extract($_POST);
if(isset($login) && !empty($login))
{
$time = date("Y-m-d H:i:s");
$sql = "INSERT INTO friends(follower, friend, dateheure) VALUES ('".$login."', '".$loginpage."', '".$time."')";
$name = mysqli_query($aVar, $sql);
echo "ok";
}
else
{
	echo "error following";
}
?>

Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
include('../../config.php');
 
extract($_POST);
if(isset($login) && !empty($login))
{
$sql = "DELETE FROM friends WHERE follower='".$login."' AND friend='".$loginpage."'";
$name = mysqli_query($aVar, $sql);
echo "ok";
}
else
{
	echo "error following";
}
?>

Je m'entraine en Ajax je n'en avais encore jamais fait alors s'il vous plait ne m'engueulez pas j'espère que vous pourrez vite m'aider à améliorer ça.

Je vous remercie beaucoup d'avance...