<script>
$(document).ready(function(){
$(".add_friend").click(function(){
f_id = this.id;
user_id = <?php echo $_SESSION['user_id']; ?>;
$.ajax({
type:"POST",
data:{"f_id":f_id,"user_id":user_id},
url:"request_send.php",
success:function(data){
$("#add").css("display","none");
$(".friend").css("display","block");
}
});
});
});
</script>
<div class="profile_btnn" id="add" style="display:block;">
<button type="submit" name="add_friend" id="<?php echo $row_add['user_id']; ?>" class="btnplus add_friend"><i class="fa fa-plus"></i> Add Friend</button>
</div>
<div class="friend" style="display:none;">
<div class="profile_btnn set_btn">
<button type="submit" name="req_sent" id="<?php echo $row_req['f_id']; ?>" class="btnplus req_sent"><i class="fa fa-plus"></i> Request Sent</button>
</div>
</div>
In this code. I want to change div i.e. id="add"
with class="friend"
after ajax success. Now, What happens when I click on add_friend
it works successfully and change id="add"
with class="friend"
. But the problem is when I refresh the page it again show me add friend
. So, How can I fix this issue? Please help me.
Thank You