Question

I have a button that sends the data to the database with Ajax. But How would I make this button change to friend requested automatically once this data is sent through?

Would I put my friend requested/revoke button in the success to replace it?

Add friend button

<button cursor='pointer' onClick=\"addfriend(".$user2_id.");\">Add Friend</button>

AJAX

function addfriend(user2_id){   
$.ajax({
   type: "POST",
   url: "../add_friend.php",
   data: "user2_id="+user2_id,
   success: function(){
   }
 });
}

Answer 1

You may do this with the help of a database. The target user id may be attached to this user database or table. A class echo may be made using php if matching user id is found. The button may be given a specific class using php echo and the button may be styled differently using CSS. Also you may disable AJAX request for that button (by specifying AJAX function for some active class button only).

Try this;

In your php;

<?php
// if request not sent: $addfunction  = 'onClick=\"addfriend(".$user2_id.");\"'; AND $addbuttonclass = "active";
// if request sent: $addbuttonclass = "inactive";
?>

and in your button part;

<button class="<?php echo $addbuttonclass; ?>" <?php echo $addfunction; ?>\">Add Friend</button>

Finally your CSS

.active{
cursor: pointer;
background-color: #0066CC;
}
.inactive{
background-color: #EEEEEE;
}