如何在我的网站上添加关注-取消关注按钮？

Question

I want to make a button on my website so that a user can click follow OR Unfollow on a certain game.

Here is my follow Table: Follow Button Table

When a user clicks on the button associated with the game ID, it should insert 1 into the game_follow database for that id.

(I already have a game and users table, and I know how to get each of those ID's)

I know this is a broad question, but maybe someone can point me in the right direction, or show me another tutorial.

EDIT: This so far isn't working:

Heres my button:

 <button class="follow-game" data-game_id="<?php echo $game_id['id']; ?>">Follow!</button> 

Heres my ajax call:

 $(function(){ $('.follow-game').click(function(){ follow_game(this); }); }); function follow_game(obj){ var game_id = $(obj).attr('data-game_id'); jQuery.ajax({ url: 'follow.php', type: 'POST', data: { game_id : game_id }, success: function(data) { alert("You Followed!"); }, error: function () { alert("Something went wrong with Follow Button."); } }); } 

And here is my follow.php

 <?php require_once 'core/init.php'; // Set user_id to the currently logged in user. $user_id = $user_data['id']; // Set $game_id to the current ID of the game (coming from ajax call) $game_id = $_POST['game_id']; // Grab the game (ID) from the games table, then Query it. //$SQL_SELECT_GAME = "select * from games where id = '$game_id'"; //$db->query($SQL_SELECT_GAME); // Do an update on game_follow table, and set follow = 1 (means that this game is being followed) where the user_id = $user_id and game_id = $game_id, then Query it. $SQL_UPDATE = "update game_follows set follow = 1 where user_id = '$user_id' and game_id = '$game_id'"; $db->query($SQL_UPDATE); 

My table is the image link above

Answer 1

Definitely a broad question, so, broad answers:

My suggestion would be to attach a javascript listener to the button, which will call an ajax function running a php script, executing the mysql query to update you database accordingly.

For the html:

<button class="follow-game" data-game_id="1">Follow!</button

For the javascript: (jquery is my preference, so that's my example)

$(function(){
   $('.follow-game').click(function(){
      follow_game(this);
   });
});
function follow_game(obj){
game_id = $(obj).attr('data-game_id');

$.ajax({
  url: '/follow.php',
  type: 'POST',
  dataType: 'json',
  data: {
    game_id : game_id
  },
  success: function(rs){
    alert("yay");
  }
});

}

For the PHP/MYSQL:

$user_id = $_SESSION['user_id'];
$game_id = $_POST['game_id'];
$sql = "UPDATE `game_follows` SET follow = 1 WHERE user_id='{$user_id}' AND $game_id='{$game_id}'";

Then run the sql with whatever mysql connection/method you're using. Of course, this doesn't take security into consideration at all, etc, but worry about that once you have the basic functionality down.