What's the best way to return stuff from a PHP function, and simultaneously trigger a jQuery action?

Question

So the title is a tad ambiguous, but I'll try and give an example. Basically, I have an 'awards' system (similar to that of StackOverflow's badges) in my PHP/CodeIgniter site, and I want, as soon as an award is earned, a notification to appear to the user.

Now I'm happy to have this appear on the next page load, but, ideally I'd like it to appear as soon as the award is transactioned since my site is mostly Ajax-powered and there may not be page reloads very often.

The way the system works currently, is:

1) If the user does something to trigger the earning of an award, CodeIgniter does this:

$params['user_id'] = $this->tank_auth->get_user_id();
$params['award_id'] = 1; // (I have a database table with different awards in)
$this->awards->award($params);

2) My custom library, $this->awards, runs the award function:

function award($params)
{
    $sql = $this->ci->db->query("INSERT INTO  users_awards (user_id, award_id)
                                 VALUES ('".$params['user_id']."','".$params['award_id']."')
                                 ON DUPLICATE KEY UPDATE duplicate=duplicate+1");

    $awardinfo = $this->ci->db->query("SELECT * FROM awards WHERE id = ".$params['award_id']);

    // If it's the 'first time' the user has gotten the award (e.g. they've earnt it)
    if ($awardinfo->row('duplicate') == 0) {
        $params['title']       = $awardinfo->row('title');
        $params['description'] = $awardinfo->row('description');
        $params['iconpath']    = $awardinfo->row('iconpath');
        $params['percentage']  = $awardinfo->row('percentage');

        return $params;
    }
}

So, it awards the user (and if they've earnt it twice, updates a useless duplicate field by one), then checks if it's the first time they've earnt it (so it can alert them of the award). If so, it gets the variables (title of the award, the award description, the path to an icon to display for the award, and finally the percentage of users who have also got this award) and returns them as an array.

So... that's that. Now I'd like to know, what's the best way to do this? Currently my Award-giving bit is called from a controller, but I guess if I want this to trigger via Ajax, then the code should be placed in a View file...?

To sum it up: I need the returned award data to appear without a page refresh. What's the best way of doing this? (I'm already using jQuery on my page).

Thanks very much everybody!

Jack

Answer 1

You need to implement a system of push notification. There are a couple of ways of doing this. You could simply poll for changes:

setInterval(check_awards, 30000);

function check_awards() {
  $.getJSON('/awards.php', function(result) {
    ...
  });
}

Every 30 seconds this checks for new awards. If something new is required, the PHP script returns an appropriate JSON object as to the type of award and so on.

Another way is to use faux push notification:

$(function() {
  check_awards();
});

function check_awards() {
  $.ajax({
    url: '/awards.php',
    success: function(data) {
      // update awards
    },
    complete: function() {
      check_awards();
    }
  });
}

This is sometimes called long-polling. You need to change it so your PHP script doesn't end until there's something to return. Whenever the AJAX request returns (due to success or timeout or other error) you start the request again.

For a detailed example see How to show popup message like in stackoverflow.