how to send asynchronous request to php page using jquery ajax

Question

i am new to web development creating a kind of social networking website for college project. I want to include update the messages count in the message menu every time there is a new msg in the database for the user(like facebook message menu on homepage)

But it's frustrating learning ajax, however after searching on web and reading some topics from some books I came to the solution that i can make an $ajax call in my js file in the homepage and send data ('name'=>'user') stored in javascript cookie that i have created on loading of home page after the user login, to a php file which will search across the recent_msg table in database to fetch the recent message for the logged in user if any after fetching the php file will create the html file with code snippet and further another jquery code will append that snippet from file to the message list menu.

the PHP part is not the problem but how can i send the username to the php file using jquery ajax api, here is the code what i think i can apply but i am doubtful in that if this is the correct way

$(document).ready(function{

setInterval ( function()
{
    var usr = getCookie("name");
    $.ajax ( {
        url: '/phpScripts/recent_msg.php',
        type: 'POST',
        data: usr,
        success: function(data){

             }
        } );
},10);
});

what is the purpose of success function in the code?

Answer 1

data needs to be in the form of an object / key-value-pair (EDIT: or if a string, as a valid querystring). data: { name: usr } . However, since it's in a cookie, your PHP page will have direct access to that cookie. It's safer to let your session cookie tel the PHP page who the user is instead of relying on an AJAX call to tell the PHP page who it is.

http://php.net/manual/en/features.cookies.php

So I'd drop data from your AJAX call altogether, and in your PHP page, use $_COOKIE["name:"]

Then whatever HTML gets passed back from the PHP page will arrive in the data call. If it's HTML, then simply add it to your HTML to some message div, such as.

<div id="recent-messages"></div>

<script type="text/javascript">
$(document).ready(function{

setInterval ( function()
{
    var usr = getCookie("name");
    $.ajax ( {
        url: '/phpScripts/recent_msg.php',
        type: 'POST',
        data: usr,
        success: function(data){
                $('#recent-messages').html(data);
             }
        } );
},10);
});
</script>

Answer 2

The success function executes whenever your ajax call completes successfully. This means that the page actually exists and no server-side errors occurred on the page. The variable data will contain whatever information is returned from the page on the sever /phpScripts/recent_msg.php. Generally this is either json or xml, but it entirely depends on your implementation of recent_msg.php.

Answer 3

If the user has to log in that means you have to have created a session . In that case you can store the logged in user's information such as their name in $_SESSION on the server and there is no need to store it as a cookie. Since $_SESSION is already on the server, there is no need to send that data via ajax in any case.