Question

I’m having an issue with implementing a LIKE Button for my website. I’m trying to do a feature whereby when the LIKE button is clicked, the total likes is displayed on the screen
without reloading the page. The code i’m showing below is used to obtain the comments under a specific article, including the likes for each comment. All is working fine at this stage, but how do I pass it to a AJAX/implement an AJAX on the script.

when the LIKE Button is clicked, what link in used in the < a h ref =” ” >?
Is AJAX written alone or inside the PHP?
How do I make it not go away from the current page, while still having the updated likes display from the database?

Please I’m not looking for a do all code, all I need is just how to get myself started with this.

Thanks for your time and effort. I most appreciate it.
Thanks

$query6 = mysql_query("
  SELECT
    c.user , c.body  , c.date, c.like                                                                     
  FROM
    comment AS c  
      INNER JOIN about_ AS ac ON c.article_id = ac.about_id
  WHERE
    c.article_id =  '".$article_id."'
    AND page_name = '".$page_name."'
") or die (mysql_error()); 

Answer 1

$(document).ready(function(){
                $('#likeButton').click(function(e){ <------ click event
                   dataString = 'param1='+ 'value1'+'&param2='+'value2'; <----- The variables which you will pass along with the request. 
                    $.ajax({
                        type: 'POST', <---------- GET or POST
                        url: 'process.php', <---------- The Url (Which will process the data)
                        data: dataString, <-------- The data
                        success: function(data){ <----- if request is success, do something with the response
                            alert(data); <----- you can output by $('#output').html(data) where output can be a div
                        },
                        error: function(request, status, error){ <----- if Error returns, then check the error or do something else.
                            alert(request.responseText);
                        }
                    })
                })
            })

It is not that difficult if you do it step by step. I prefer $.ajax as it gives more control over the data sent. Now Modify the above code to suit your need.

And there are more functions you can add above. Read here